When combining a directive with isolate scope and custom validation, the validation process changes my scope
value to undefined
if the validation fails.
You can view the code in this jsfiddle link: http://jsfiddle.net/5mKU3/7/
The HTML structure is as follows:
<div ng-app="myApp">
<div ng-controller="example">
someModel: {{someValue}}<br>
<input type="text" isolate ng-model="someValue" validate />
</div>
</div>
The JavaScript implementation is outlined below:
angular.module('myApp', []).directive('isolate', function () {
return {
require: 'ngModel',
scope: {}
};
}).directive('validate', function () {
return {
require: 'ngModel',
link: function (scope, element, attrs, ctrl) {
ctrl.$parsers.unshift(function (value) {
value = value || '';
if (value.length < 10) {
ctrl.$setValidity('fail', true);
return value;
} else {
ctrl.$setValidity('fail', false);
return undefined;
}
});
}
};
}).controller('example', function ($scope) {
$scope.someValue = '1234';
});
If the input exceeds 10 characters, the validation will fail. Is there a way to prevent the $scope.someValue
from being set to undefined
when validation fails?
Note that the angular version used in this scenario is 1.2.18.