mirror of
https://github.com/Hopiu/angular.js.git
synced 2026-04-10 10:01:00 +00:00
fix(forms): prefix all form and control properties with $
This commit is contained in:
Igor Minar
parent
5e6ba25201
commit
f59e4b11f1
8 changed files with 345 additions and 345 deletions
|
|
@ -52,7 +52,7 @@ detection, and preventing invalid form submission.
|
|||
};
|
||||
|
||||
$scope.isSaveDisabled = function() {
|
||||
return $scope.myForm.invalid || angular.equals(master, $scope.form);
|
||||
return $scope.myForm.$invalid || angular.equals(master, $scope.form);
|
||||
};
|
||||
|
||||
$scope.cancel();
|
||||
|
|
|
|||
|
|
@ -162,9 +162,9 @@ stored on the `FormController`.
|
|||
<form name="form" class="css-form" novalidate>
|
||||
Name: <input type="text" ng-model="user.name" name="userName" required /><br />
|
||||
E-mail: <input type="email" ng-model="user.email" name="userEmail" required/><br />
|
||||
<span ng-show="form.userEmail.dirty && form.userEmail.invalid">Invalid:
|
||||
<span ng-show="form.userEmail.error.REQUIRED">Please tell us your email.</span>
|
||||
<span ng-show="form.userEmail.error.EMAIL">This is not a valid email.</span><br />
|
||||
<span ng-show="form.userEmail.$dirty && form.userEmail.$invalid">Invalid:
|
||||
<span ng-show="form.userEmail.$error.REQUIRED">Please tell us your email.</span>
|
||||
<span ng-show="form.userEmail.$error.EMAIL">This is not a valid email.</span><br />
|
||||
</span>
|
||||
|
||||
Gender: <input type="radio" ng-model="user.gender" value="male" />male
|
||||
|
|
@ -175,7 +175,7 @@ stored on the `FormController`.
|
|||
<div ng-show="!user.agree || !user.agreeSign">Please agree and sign.</div>
|
||||
|
||||
<button ng-click="reset()" disabled="{{isUnchanged(user)}}">RESET</button>
|
||||
<button ng-click="update(user)" disabled="{{form.invalid || isUnchanged(user)}}">SAVE</button>
|
||||
<button ng-click="update(user)" disabled="{{form.$invalid || isUnchanged(user)}}">SAVE</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
|
@ -214,10 +214,10 @@ function gets fourth argument - an instance of `NgModelController`, which is a c
|
|||
to `ng-model`, that allows you to hook into the validation process.
|
||||
|
||||
## Model to View update
|
||||
Whenever the bound model changes, all functions in {@link api/angular.module.ng.$compileProvider.directive.ng:model.NgModelController#formatters NgModelController#formatters} array are pipe-lined, so that each of these functions has an opportunity to format the value and change validity state of the form control through {@link api/angualar.module.ng.$compileProvider.directive.ng:model.NgModelController#setValidity NgModelController#setValidity}.
|
||||
Whenever the bound model changes, all functions in {@link api/angular.module.ng.$compileProvider.directive.ng:model.NgModelController#formatters NgModelController#formatters} array are pipe-lined, so that each of these functions has an opportunity to format the value and change validity state of the form control through {@link api/angualar.module.ng.$compileProvider.directive.ng:model.NgModelController#$setValidity NgModelController#$setValidity}.
|
||||
|
||||
## View to Model update
|
||||
In a similar way, whenever a form control calls {@link api/angular.module.ng.$compileProvider.directive.ng:model.NgModelController#setViewValue NgModelController#setViewValue}, all functions in {@link api/angular.module.ng.$compileProvider.directive.ng:model.NgModelController#parsers NgModelController#parsers} array are pipe-lined, so that each of these functions has an opportunity to correct/convert the value and change validity state of the form control through {@link api/angualar.module.ng.$compileProvider.directive.ng:model.NgModelController#setValidity NgModelController#setValidity}.
|
||||
In a similar way, whenever a form control calls {@link api/angular.module.ng.$compileProvider.directive.ng:model.NgModelController#setViewValue NgModelController#setViewValue}, all functions in {@link api/angular.module.ng.$compileProvider.directive.ng:model.NgModelController#parsers NgModelController#parsers} array are pipe-lined, so that each of these functions has an opportunity to correct/convert the value and change validity state of the form control through {@link api/angualar.module.ng.$compileProvider.directive.ng:model.NgModelController#setValidity NgModelController#$setValidity}.
|
||||
|
||||
In this example we create two simple directives. The first one is `integer` and it validates whether the input is valid integer, so for example `1.23` is an invalid value. Note, that we unshift the array instead of pushing - that's because we want to get a string value, so we need to execute the validation function before a conversion to number happens.
|
||||
|
||||
|
|
@ -230,13 +230,13 @@ The second directive is `smart-float`. It parses both `1.2` and `1,2` into a val
|
|||
<form name="form" class="css-form" novalidate>
|
||||
<div>
|
||||
Size (integer 0 - 10): <input type="number" ng-model="size" name="size" min="0" max="10" integer />{{size}}<br />
|
||||
<span ng-show="form.size.error.INTEGER">This is not valid integer!</span>
|
||||
<span ng-show="form.size.error.MIN || form.size.error.MAX">The value must be in range 0 to 10!</span>
|
||||
<span ng-show="form.size.$error.INTEGER">This is not valid integer!</span>
|
||||
<span ng-show="form.size.$error.MIN || form.size.$error.MAX">The value must be in range 0 to 10!</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Length (float): <input type="text" ng-model="length" name="length" smart-float />{{length}}<br />
|
||||
<span ng-show="form.length.error.FLOAT">This is not valid number!</span>
|
||||
<span ng-show="form.length.$error.FLOAT">This is not valid number!</span>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -249,14 +249,14 @@ The second directive is `smart-float`. It parses both `1.2` and `1,2` into a val
|
|||
return {
|
||||
require: 'ngModel',
|
||||
link: function(scope, elm, attrs, ctrl) {
|
||||
ctrl.parsers.unshift(function(viewValue) {
|
||||
ctrl.$parsers.unshift(function(viewValue) {
|
||||
if (INTEGER_REGEXP.test(viewValue)) {
|
||||
// it is valid
|
||||
ctrl.setValidity('INTEGER', true);
|
||||
ctrl.$setValidity('INTEGER', true);
|
||||
return viewValue;
|
||||
} else {
|
||||
// it is invalid, return undefined (no model update)
|
||||
ctrl.setValidity('INTEGER', false);
|
||||
ctrl.$setValidity('INTEGER', false);
|
||||
return undefined;
|
||||
}
|
||||
});
|
||||
|
|
@ -269,12 +269,12 @@ The second directive is `smart-float`. It parses both `1.2` and `1,2` into a val
|
|||
return {
|
||||
require: 'ngModel',
|
||||
link: function(scope, elm, attrs, ctrl) {
|
||||
ctrl.parsers.unshift(function(viewValue) {
|
||||
ctrl.$parsers.unshift(function(viewValue) {
|
||||
if (FLOAT_REGEXP.test(viewValue)) {
|
||||
ctrl.setValidity('FLOAT', true);
|
||||
ctrl.$setValidity('FLOAT', true);
|
||||
return parseFloat(viewValue.replace(',', '.'));
|
||||
} else {
|
||||
ctrl.setValidity('FLOAT', false);
|
||||
ctrl.$setValidity('FLOAT', false);
|
||||
return undefined;
|
||||
}
|
||||
});
|
||||
|
|
@ -308,7 +308,7 @@ This example shows how easy it is to add a support for binding contentEditable e
|
|||
// view -> model
|
||||
elm.bind('blur', function() {
|
||||
scope.$apply(function() {
|
||||
ctrl.setViewValue(elm.html());
|
||||
ctrl.$setViewValue(elm.html());
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -318,7 +318,7 @@ This example shows how easy it is to add a support for binding contentEditable e
|
|||
};
|
||||
|
||||
// load init value from DOM
|
||||
ctrl.setViewValue(elm.html());
|
||||
ctrl.$setViewValue(elm.html());
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
|
|||
|
|
@ -5,12 +5,12 @@
|
|||
* @ngdoc object
|
||||
* @name angular.module.ng.$compileProvider.directive.form.FormController
|
||||
*
|
||||
* @property {boolean} pristine True if user has not interacted with the form yet.
|
||||
* @property {boolean} dirty True if user has already interacted with the form.
|
||||
* @property {boolean} valid True if all of the containg widgets are valid.
|
||||
* @property {boolean} invalid True if at least one containing widget is invalid.
|
||||
* @property {boolean} $pristine True if user has not interacted with the form yet.
|
||||
* @property {boolean} $dirty True if user has already interacted with the form.
|
||||
* @property {boolean} $valid True if all of the containg widgets are valid.
|
||||
* @property {boolean} $invalid True if at least one containing widget is invalid.
|
||||
*
|
||||
* @property {Object} error Is an object hash, containing references to all invalid widgets, where
|
||||
* @property {Object} $error Is an object hash, containing references to all invalid widgets, where
|
||||
*
|
||||
* - keys are error ids (such as `REQUIRED`, `URL` or `EMAIL`),
|
||||
* - values are arrays of widgets that are invalid with given error.
|
||||
|
|
@ -22,11 +22,11 @@
|
|||
* of `FormController`.
|
||||
*
|
||||
*/
|
||||
FormController.$inject = ['$scope', 'name', '$element'];
|
||||
function FormController($scope, name, element) {
|
||||
FormController.$inject = ['name', '$element'];
|
||||
function FormController(name, element) {
|
||||
var form = this,
|
||||
parentForm = element.parent().inheritedData('$formController'),
|
||||
errors = form.error = {};
|
||||
errors = form.$error = {};
|
||||
|
||||
// publish the form into scope
|
||||
name(this);
|
||||
|
|
@ -36,14 +36,14 @@ function FormController($scope, name, element) {
|
|||
}
|
||||
|
||||
form.$addControl = function(control) {
|
||||
if (control.name && !form.hasOwnProperty(control.name)) {
|
||||
form[control.name] = control;
|
||||
if (control.$name && !form.hasOwnProperty(control.$name)) {
|
||||
form[control.$name] = control;
|
||||
}
|
||||
}
|
||||
|
||||
form.$removeControl = function(control) {
|
||||
if (control.name && form[control.name] === control) {
|
||||
delete form[control.name];
|
||||
if (control.$name && form[control.$name] === control) {
|
||||
delete form[control.$name];
|
||||
}
|
||||
forEach(errors, cleanupControlErrors, control);
|
||||
};
|
||||
|
|
@ -53,27 +53,27 @@ function FormController($scope, name, element) {
|
|||
cleanupControlErrors(errors[validationToken], validationToken, control);
|
||||
|
||||
if (equals(errors, {})) {
|
||||
form.valid = true;
|
||||
form.invalid = false;
|
||||
form.$valid = true;
|
||||
form.$invalid = false;
|
||||
}
|
||||
} else {
|
||||
addControlError(validationToken, control);
|
||||
|
||||
form.valid = false;
|
||||
form.invalid = true;
|
||||
form.$valid = false;
|
||||
form.$invalid = true;
|
||||
}
|
||||
};
|
||||
|
||||
form.$setDirty = function() {
|
||||
form.dirty = true;
|
||||
form.pristine = false;
|
||||
form.$dirty = true;
|
||||
form.$pristine = false;
|
||||
}
|
||||
|
||||
// init state
|
||||
form.dirty = false;
|
||||
form.pristine = true;
|
||||
form.valid = true;
|
||||
form.invalid = false;
|
||||
form.$dirty = false;
|
||||
form.$pristine = true;
|
||||
form.$valid = true;
|
||||
form.$invalid = false;
|
||||
|
||||
function cleanupControlErrors(queue, validationToken, control) {
|
||||
if (queue) {
|
||||
|
|
@ -180,24 +180,24 @@ function FormController($scope, name, element) {
|
|||
</script>
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
userType: <input name="input" ng-model="userType" required>
|
||||
<span class="error" ng-show="myForm.input.error.REQUIRED">Required!</span><br>
|
||||
<span class="error" ng-show="myForm.input.$error.REQUIRED">Required!</span><br>
|
||||
<tt>userType = {{userType}}</tt><br>
|
||||
<tt>myForm.input.valid = {{myForm.input.valid}}</tt><br>
|
||||
<tt>myForm.input.error = {{myForm.input.error}}</tt><br>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br>
|
||||
</form>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('userType')).toEqual('guest');
|
||||
expect(binding('myForm.input.valid')).toEqual('true');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('userType').enter('');
|
||||
expect(binding('userType')).toEqual('');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -219,7 +219,7 @@ var formDirective = [function() {
|
|||
|
||||
forEach(['valid', 'invalid', 'dirty', 'pristine'], function(name) {
|
||||
scope.$watch(function() {
|
||||
return controller[name];
|
||||
return controller['$' + name];
|
||||
}, function(value) {
|
||||
formElement[value ? 'addClass' : 'removeClass']('ng-' + name);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -38,33 +38,33 @@ var inputType = {
|
|||
<form name="myForm" ng-controller="Ctrl">
|
||||
Single word: <input type="text" name="input" ng-model="text"
|
||||
ng-pattern="word" required>
|
||||
<span class="error" ng-show="myForm.input.error.REQUIRED">
|
||||
<span class="error" ng-show="myForm.input.$error.REQUIRED">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.input.error.PATTERN">
|
||||
<span class="error" ng-show="myForm.input.$error.PATTERN">
|
||||
Single word only!</span>
|
||||
|
||||
<tt>text = {{text}}</tt><br/>
|
||||
<tt>myForm.input.valid = {{myForm.input.valid}}</tt><br/>
|
||||
<tt>myForm.input.error = {{myForm.input.error}}</tt><br/>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br/>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br/>
|
||||
</form>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('text')).toEqual('guest');
|
||||
expect(binding('myForm.input.valid')).toEqual('true');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('text').enter('');
|
||||
expect(binding('text')).toEqual('');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if multi word', function() {
|
||||
input('text').enter('hello world');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -106,33 +106,33 @@ var inputType = {
|
|||
<form name="myForm" ng-controller="Ctrl">
|
||||
Number: <input type="number" name="input" ng-model="value"
|
||||
min="0" max="99" required>
|
||||
<span class="error" ng-show="myForm.list.error.REQUIRED">
|
||||
<span class="error" ng-show="myForm.list.$error.REQUIRED">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.list.error.NUMBER">
|
||||
<span class="error" ng-show="myForm.list.$error.NUMBER">
|
||||
Not valid number!</span>
|
||||
<tt>value = {{value}}</tt><br/>
|
||||
<tt>myForm.input.valid = {{myForm.input.valid}}</tt><br/>
|
||||
<tt>myForm.input.error = {{myForm.input.error}}</tt><br/>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br/>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br/>
|
||||
</form>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('value')).toEqual('12');
|
||||
expect(binding('myForm.input.valid')).toEqual('true');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('value').enter('');
|
||||
expect(binding('value')).toEqual('');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if over max', function() {
|
||||
input('value').enter('123');
|
||||
expect(binding('value')).toEqual('');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -171,33 +171,33 @@ var inputType = {
|
|||
</script>
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
URL: <input type="url" name="input" ng-model="text" required>
|
||||
<span class="error" ng-show="myForm.input.error.REQUIRED">
|
||||
<span class="error" ng-show="myForm.input.$error.REQUIRED">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.input.error.url">
|
||||
<span class="error" ng-show="myForm.input.$error.url">
|
||||
Not valid url!</span>
|
||||
<tt>text = {{text}}</tt><br/>
|
||||
<tt>myForm.input.valid = {{myForm.input.valid}}</tt><br/>
|
||||
<tt>myForm.input.error = {{myForm.input.error}}</tt><br/>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br/>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.error.url = {{!!myForm.error.url}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.$error.url = {{!!myForm.$error.url}}</tt><br/>
|
||||
</form>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('text')).toEqual('http://google.com');
|
||||
expect(binding('myForm.input.valid')).toEqual('true');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('text').enter('');
|
||||
expect(binding('text')).toEqual('');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if not url', function() {
|
||||
input('text').enter('xxx');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -234,33 +234,33 @@ var inputType = {
|
|||
</script>
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
Email: <input type="email" name="input" ng-model="text" required>
|
||||
<span class="error" ng-show="myForm.input.error.REQUIRED">
|
||||
<span class="error" ng-show="myForm.input.$error.REQUIRED">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.input.error.EMAIL">
|
||||
<span class="error" ng-show="myForm.input.$error.EMAIL">
|
||||
Not valid email!</span>
|
||||
<tt>text = {{text}}</tt><br/>
|
||||
<tt>myForm.input.valid = {{myForm.input.valid}}</tt><br/>
|
||||
<tt>myForm.input.error = {{myForm.input.error}}</tt><br/>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br/>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.error.EMAIL = {{!!myForm.error.EMAIL}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.$error.EMAIL = {{!!myForm.$error.EMAIL}}</tt><br/>
|
||||
</form>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('text')).toEqual('me@example.com');
|
||||
expect(binding('myForm.input.valid')).toEqual('true');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('text').enter('');
|
||||
expect(binding('text')).toEqual('');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if not email', function() {
|
||||
input('text').enter('xxx');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -370,12 +370,12 @@ function isEmpty(value) {
|
|||
function textInputType(scope, element, attr, ctrl) {
|
||||
element.bind('blur', function() {
|
||||
scope.$apply(function() {
|
||||
ctrl.setViewValue(trim(element.val()));
|
||||
ctrl.$setViewValue(trim(element.val()));
|
||||
});
|
||||
});
|
||||
|
||||
ctrl.render = function() {
|
||||
element.val(isEmpty(ctrl.viewValue) ? '' : ctrl.viewValue);
|
||||
ctrl.$render = function() {
|
||||
element.val(isEmpty(ctrl.$viewValue) ? '' : ctrl.$viewValue);
|
||||
};
|
||||
|
||||
// pattern validator
|
||||
|
|
@ -384,10 +384,10 @@ function textInputType(scope, element, attr, ctrl) {
|
|||
|
||||
var validate = function(regexp, value) {
|
||||
if (isEmpty(value) || regexp.test(value)) {
|
||||
ctrl.setValidity('PATTERN', true);
|
||||
ctrl.$setValidity('PATTERN', true);
|
||||
return value;
|
||||
} else {
|
||||
ctrl.setValidity('PATTERN', false);
|
||||
ctrl.$setValidity('PATTERN', false);
|
||||
return undefined;
|
||||
}
|
||||
};
|
||||
|
|
@ -409,8 +409,8 @@ function textInputType(scope, element, attr, ctrl) {
|
|||
};
|
||||
}
|
||||
|
||||
ctrl.formatters.push(patternValidator);
|
||||
ctrl.parsers.push(patternValidator);
|
||||
ctrl.$formatters.push(patternValidator);
|
||||
ctrl.$parsers.push(patternValidator);
|
||||
}
|
||||
|
||||
// min length validator
|
||||
|
|
@ -418,16 +418,16 @@ function textInputType(scope, element, attr, ctrl) {
|
|||
var minlength = parseInt(attr.ngMinlength, 10);
|
||||
var minLengthValidator = function(value) {
|
||||
if (!isEmpty(value) && value.length < minlength) {
|
||||
ctrl.setValidity('MINLENGTH', false);
|
||||
ctrl.$setValidity('MINLENGTH', false);
|
||||
return undefined;
|
||||
} else {
|
||||
ctrl.setValidity('MINLENGTH', true);
|
||||
ctrl.$setValidity('MINLENGTH', true);
|
||||
return value;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.parsers.push(minLengthValidator);
|
||||
ctrl.formatters.push(minLengthValidator);
|
||||
ctrl.$parsers.push(minLengthValidator);
|
||||
ctrl.$formatters.push(minLengthValidator);
|
||||
}
|
||||
|
||||
// max length validator
|
||||
|
|
@ -435,34 +435,34 @@ function textInputType(scope, element, attr, ctrl) {
|
|||
var maxlength = parseInt(attr.ngMaxlength, 10);
|
||||
var maxLengthValidator = function(value) {
|
||||
if (!isEmpty(value) && value.length > maxlength) {
|
||||
ctrl.setValidity('MAXLENGTH', false);
|
||||
ctrl.$setValidity('MAXLENGTH', false);
|
||||
return undefined;
|
||||
} else {
|
||||
ctrl.setValidity('MAXLENGTH', true);
|
||||
ctrl.$setValidity('MAXLENGTH', true);
|
||||
return value;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.parsers.push(maxLengthValidator);
|
||||
ctrl.formatters.push(maxLengthValidator);
|
||||
ctrl.$parsers.push(maxLengthValidator);
|
||||
ctrl.$formatters.push(maxLengthValidator);
|
||||
}
|
||||
};
|
||||
|
||||
function numberInputType(scope, element, attr, ctrl) {
|
||||
textInputType(scope, element, attr, ctrl);
|
||||
|
||||
ctrl.parsers.push(function(value) {
|
||||
ctrl.$parsers.push(function(value) {
|
||||
var empty = isEmpty(value);
|
||||
if (empty || NUMBER_REGEXP.test(value)) {
|
||||
ctrl.setValidity('NUMBER', true);
|
||||
ctrl.$setValidity('NUMBER', true);
|
||||
return value === '' ? null : (empty ? value : parseFloat(value));
|
||||
} else {
|
||||
ctrl.setValidity('NUMBER', false);
|
||||
ctrl.$setValidity('NUMBER', false);
|
||||
return undefined;
|
||||
}
|
||||
});
|
||||
|
||||
ctrl.formatters.push(function(value) {
|
||||
ctrl.$formatters.push(function(value) {
|
||||
return isEmpty(value) ? '' : '' + value;
|
||||
});
|
||||
|
||||
|
|
@ -470,41 +470,41 @@ function numberInputType(scope, element, attr, ctrl) {
|
|||
var min = parseFloat(attr.min);
|
||||
var minValidator = function(value) {
|
||||
if (!isEmpty(value) && value < min) {
|
||||
ctrl.setValidity('MIN', false);
|
||||
ctrl.$setValidity('MIN', false);
|
||||
return undefined;
|
||||
} else {
|
||||
ctrl.setValidity('MIN', true);
|
||||
ctrl.$setValidity('MIN', true);
|
||||
return value;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.parsers.push(minValidator);
|
||||
ctrl.formatters.push(minValidator);
|
||||
ctrl.$parsers.push(minValidator);
|
||||
ctrl.$formatters.push(minValidator);
|
||||
}
|
||||
|
||||
if (attr.max) {
|
||||
var max = parseFloat(attr.max);
|
||||
var maxValidator = function(value) {
|
||||
if (!isEmpty(value) && value > max) {
|
||||
ctrl.setValidity('MAX', false);
|
||||
ctrl.$setValidity('MAX', false);
|
||||
return undefined;
|
||||
} else {
|
||||
ctrl.setValidity('MAX', true);
|
||||
ctrl.$setValidity('MAX', true);
|
||||
return value;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.parsers.push(maxValidator);
|
||||
ctrl.formatters.push(maxValidator);
|
||||
ctrl.$parsers.push(maxValidator);
|
||||
ctrl.$formatters.push(maxValidator);
|
||||
}
|
||||
|
||||
ctrl.formatters.push(function(value) {
|
||||
ctrl.$formatters.push(function(value) {
|
||||
|
||||
if (isEmpty(value) || isNumber(value)) {
|
||||
ctrl.setValidity('NUMBER', true);
|
||||
ctrl.$setValidity('NUMBER', true);
|
||||
return value;
|
||||
} else {
|
||||
ctrl.setValidity('NUMBER', false);
|
||||
ctrl.$setValidity('NUMBER', false);
|
||||
return undefined;
|
||||
}
|
||||
});
|
||||
|
|
@ -515,16 +515,16 @@ function urlInputType(scope, element, attr, ctrl) {
|
|||
|
||||
var urlValidator = function(value) {
|
||||
if (isEmpty(value) || URL_REGEXP.test(value)) {
|
||||
ctrl.setValidity('URL', true);
|
||||
ctrl.$setValidity('URL', true);
|
||||
return value;
|
||||
} else {
|
||||
ctrl.setValidity('URL', false);
|
||||
ctrl.$setValidity('URL', false);
|
||||
return undefined;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.formatters.push(urlValidator);
|
||||
ctrl.parsers.push(urlValidator);
|
||||
ctrl.$formatters.push(urlValidator);
|
||||
ctrl.$parsers.push(urlValidator);
|
||||
}
|
||||
|
||||
function emailInputType(scope, element, attr, ctrl) {
|
||||
|
|
@ -532,16 +532,16 @@ function emailInputType(scope, element, attr, ctrl) {
|
|||
|
||||
var emailValidator = function(value) {
|
||||
if (isEmpty(value) || EMAIL_REGEXP.test(value)) {
|
||||
ctrl.setValidity('EMAIL', true);
|
||||
ctrl.$setValidity('EMAIL', true);
|
||||
return value;
|
||||
} else {
|
||||
ctrl.setValidity('EMAIL', false);
|
||||
ctrl.$setValidity('EMAIL', false);
|
||||
return undefined;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.formatters.push(emailValidator);
|
||||
ctrl.parsers.push(emailValidator);
|
||||
ctrl.$formatters.push(emailValidator);
|
||||
ctrl.$parsers.push(emailValidator);
|
||||
}
|
||||
|
||||
function radioInputType(scope, element, attr, ctrl) {
|
||||
|
|
@ -551,14 +551,14 @@ function radioInputType(scope, element, attr, ctrl) {
|
|||
element.bind('click', function() {
|
||||
if (element[0].checked) {
|
||||
scope.$apply(function() {
|
||||
ctrl.setViewValue(attr.value);
|
||||
ctrl.$setViewValue(attr.value);
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
ctrl.render = function() {
|
||||
ctrl.$render = function() {
|
||||
var value = attr.value;
|
||||
element[0].checked = isDefined(value) && (value == ctrl.viewValue);
|
||||
element[0].checked = isDefined(value) && (value == ctrl.$viewValue);
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -571,19 +571,19 @@ function checkboxInputType(scope, element, attr, ctrl) {
|
|||
|
||||
element.bind('click', function() {
|
||||
scope.$apply(function() {
|
||||
ctrl.setViewValue(element[0].checked);
|
||||
ctrl.$setViewValue(element[0].checked);
|
||||
});
|
||||
});
|
||||
|
||||
ctrl.render = function() {
|
||||
element[0].checked = ctrl.viewValue;
|
||||
ctrl.$render = function() {
|
||||
element[0].checked = ctrl.$viewValue;
|
||||
};
|
||||
|
||||
ctrl.formatters.push(function(value) {
|
||||
ctrl.$formatters.push(function(value) {
|
||||
return value === trueValue;
|
||||
});
|
||||
|
||||
ctrl.parsers.push(function(value) {
|
||||
ctrl.$parsers.push(function(value) {
|
||||
return value ? trueValue : falseValue;
|
||||
});
|
||||
}
|
||||
|
|
@ -646,63 +646,63 @@ function checkboxInputType(scope, element, attr, ctrl) {
|
|||
<div ng-controller="Ctrl">
|
||||
<form name="myForm">
|
||||
User name: <input type="text" name="userName" ng-model="user.name" required>
|
||||
<span class="error" ng-show="myForm.userName.error.REQUIRED">
|
||||
<span class="error" ng-show="myForm.userName.$error.REQUIRED">
|
||||
Required!</span><br>
|
||||
Last name: <input type="text" name="lastName" ng-model="user.last"
|
||||
ng-minlength="3" ng-maxlength="10">
|
||||
<span class="error" ng-show="myForm.lastName.error.MINLENGTH">
|
||||
<span class="error" ng-show="myForm.lastName.$error.MINLENGTH">
|
||||
Too short!</span>
|
||||
<span class="error" ng-show="myForm.lastName.error.MAXLENGTH">
|
||||
<span class="error" ng-show="myForm.lastName.$error.MAXLENGTH">
|
||||
Too long!</span><br>
|
||||
</form>
|
||||
<hr>
|
||||
<tt>user = {{user}}</tt><br/>
|
||||
<tt>myForm.userName.valid = {{myForm.userName.valid}}</tt><br>
|
||||
<tt>myForm.userName.error = {{myForm.userName.error}}</tt><br>
|
||||
<tt>myForm.lastName.valid = {{myForm.lastName.valid}}</tt><br>
|
||||
<tt>myForm.userName.error = {{myForm.lastName.error}}</tt><br>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br>
|
||||
<tt>myForm.error.MINLENGTH = {{!!myForm.error.MINLENGTH}}</tt><br>
|
||||
<tt>myForm.error.MAXLENGTH = {{!!myForm.error.MAXLENGTH}}</tt><br>
|
||||
<tt>myForm.userName.$valid = {{myForm.userName.$valid}}</tt><br>
|
||||
<tt>myForm.userName.$error = {{myForm.userName.$error}}</tt><br>
|
||||
<tt>myForm.lastName.$valid = {{myForm.lastName.$valid}}</tt><br>
|
||||
<tt>myForm.userName.$error = {{myForm.lastName.$error}}</tt><br>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br>
|
||||
<tt>myForm.$error.MINLENGTH = {{!!myForm.$error.MINLENGTH}}</tt><br>
|
||||
<tt>myForm.$error.MAXLENGTH = {{!!myForm.$error.MAXLENGTH}}</tt><br>
|
||||
</div>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('user')).toEqual('{"last":"visitor","name":"guest"}');
|
||||
expect(binding('myForm.userName.valid')).toEqual('true');
|
||||
expect(binding('myForm.valid')).toEqual('true');
|
||||
expect(binding('myForm.userName.$valid')).toEqual('true');
|
||||
expect(binding('myForm.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty when required', function() {
|
||||
input('user.name').enter('');
|
||||
expect(binding('user')).toEqual('{"last":"visitor"}');
|
||||
expect(binding('myForm.userName.valid')).toEqual('false');
|
||||
expect(binding('myForm.valid')).toEqual('false');
|
||||
expect(binding('myForm.userName.$valid')).toEqual('false');
|
||||
expect(binding('myForm.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be valid if empty when min length is set', function() {
|
||||
input('user.last').enter('');
|
||||
expect(binding('user')).toEqual('{"last":"","name":"guest"}');
|
||||
expect(binding('myForm.lastName.valid')).toEqual('true');
|
||||
expect(binding('myForm.valid')).toEqual('true');
|
||||
expect(binding('myForm.lastName.$valid')).toEqual('true');
|
||||
expect(binding('myForm.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if less than required min length', function() {
|
||||
input('user.last').enter('xx');
|
||||
expect(binding('user')).toEqual('{"name":"guest"}');
|
||||
expect(binding('myForm.lastName.valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.error')).toMatch(/MINLENGTH/);
|
||||
expect(binding('myForm.valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.$valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.$error')).toMatch(/MINLENGTH/);
|
||||
expect(binding('myForm.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if longer than max length', function() {
|
||||
input('user.last').enter('some ridiculously long name');
|
||||
expect(binding('user'))
|
||||
.toEqual('{"name":"guest"}');
|
||||
expect(binding('myForm.lastName.valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.error')).toMatch(/MAXLENGTH/);
|
||||
expect(binding('myForm.valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.$valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.$error')).toMatch(/MAXLENGTH/);
|
||||
expect(binding('myForm.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -729,7 +729,7 @@ var inputDirective = [function() {
|
|||
* @property {Array.<Function>} parsers Whenever the widget reads value from the DOM, it executes
|
||||
* all of these functions to sanitize / convert the value as well as validate.
|
||||
*
|
||||
* @property {Array.<Function>} formatters Wheneveer the model value changes, it executes all of
|
||||
* @property {Array.<Function>} formatters Whenever the model value changes, it executes all of
|
||||
* these functions to convert the value as well as validate.
|
||||
*
|
||||
* @property {Object} error An bject hash with all errors as keys.
|
||||
|
|
@ -744,23 +744,23 @@ var inputDirective = [function() {
|
|||
*/
|
||||
var NgModelController = ['$scope', '$exceptionHandler', '$attrs', 'ngModel',
|
||||
function($scope, $exceptionHandler, $attr, ngModel) {
|
||||
this.viewValue = Number.NaN;
|
||||
this.modelValue = Number.NaN;
|
||||
this.parsers = [];
|
||||
this.formatters = [];
|
||||
this.viewChangeListeners = [];
|
||||
this.error = {};
|
||||
this.pristine = true;
|
||||
this.dirty = false;
|
||||
this.valid = true;
|
||||
this.invalid = false;
|
||||
this.render = noop;
|
||||
this.name = $attr.name;
|
||||
this.$viewValue = Number.NaN;
|
||||
this.$modelValue = Number.NaN;
|
||||
this.$parsers = [];
|
||||
this.$formatters = [];
|
||||
this.$viewChangeListeners = [];
|
||||
this.$error = {};
|
||||
this.$pristine = true;
|
||||
this.$dirty = false;
|
||||
this.$valid = true;
|
||||
this.$invalid = false;
|
||||
this.$render = noop;
|
||||
this.$name = $attr.name;
|
||||
|
||||
|
||||
/**
|
||||
* @ngdoc function
|
||||
* @name angular.module.ng.$compileProvider.directive.ng-model.NgModelController#setValidity
|
||||
* @name angular.module.ng.$compileProvider.directive.ng-model.NgModelController#$setValidity
|
||||
* @methodOf angular.module.ng.$compileProvider.directive.ng-model.NgModelController
|
||||
*
|
||||
* @description
|
||||
|
|
@ -772,21 +772,21 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', 'ngModel',
|
|||
* @param {string} validationToken Name of the validator.
|
||||
* @param {boolean} isValid Whether the current state is valid (true) or invalid (false).
|
||||
*/
|
||||
this.setValidity = function(validationToken, isValid) {
|
||||
this.$setValidity = function(validationToken, isValid) {
|
||||
|
||||
if (!isValid && this.error[validationToken]) return;
|
||||
if (isValid && !this.error[validationToken]) return;
|
||||
if (!isValid && this.$error[validationToken]) return;
|
||||
if (isValid && !this.$error[validationToken]) return;
|
||||
|
||||
if (isValid) {
|
||||
delete this.error[validationToken];
|
||||
if (equals(this.error, {})) {
|
||||
this.valid = true;
|
||||
this.invalid = false;
|
||||
delete this.$error[validationToken];
|
||||
if (equals(this.$error, {})) {
|
||||
this.$valid = true;
|
||||
this.$invalid = false;
|
||||
}
|
||||
} else {
|
||||
this.error[validationToken] = true;
|
||||
this.invalid = true;
|
||||
this.valid = false;
|
||||
this.$error[validationToken] = true;
|
||||
this.$invalid = true;
|
||||
this.$valid = false;
|
||||
}
|
||||
|
||||
if (this.$form) {
|
||||
|
|
@ -797,7 +797,7 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', 'ngModel',
|
|||
|
||||
/**
|
||||
* @ngdoc function
|
||||
* @name angular.module.ng.$compileProvider.directive.ng-model.NgModelController#setViewValue
|
||||
* @name angular.module.ng.$compileProvider.directive.ng-model.NgModelController#$setViewValue
|
||||
* @methodOf angular.module.ng.$compileProvider.directive.ng-model.NgModelController
|
||||
*
|
||||
* @description
|
||||
|
|
@ -812,24 +812,24 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', 'ngModel',
|
|||
*
|
||||
* @param {string} value Value from the view.
|
||||
*/
|
||||
this.setViewValue = function(value) {
|
||||
this.viewValue = value;
|
||||
this.$setViewValue = function(value) {
|
||||
this.$viewValue = value;
|
||||
|
||||
// change to dirty
|
||||
if (this.pristine) {
|
||||
this.dirty = true;
|
||||
this.pristine = false;
|
||||
if (this.$pristine) {
|
||||
this.$dirty = true;
|
||||
this.$pristine = false;
|
||||
if (this.$form) this.$form.$setDirty();
|
||||
}
|
||||
|
||||
forEach(this.parsers, function(fn) {
|
||||
forEach(this.$parsers, function(fn) {
|
||||
value = fn(value);
|
||||
});
|
||||
|
||||
if (this.modelValue !== value) {
|
||||
this.modelValue = value;
|
||||
if (this.$modelValue !== value) {
|
||||
this.$modelValue = value;
|
||||
ngModel(value);
|
||||
forEach(this.viewChangeListeners, function(listener) {
|
||||
forEach(this.$viewChangeListeners, function(listener) {
|
||||
try {
|
||||
listener();
|
||||
} catch(e) {
|
||||
|
|
@ -846,19 +846,19 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', 'ngModel',
|
|||
}, function(value) {
|
||||
|
||||
// ignore change from view
|
||||
if (ctrl.modelValue === value) return;
|
||||
if (ctrl.$modelValue === value) return;
|
||||
|
||||
var formatters = ctrl.formatters,
|
||||
var formatters = ctrl.$formatters,
|
||||
idx = formatters.length;
|
||||
|
||||
ctrl.modelValue = value;
|
||||
ctrl.$modelValue = value;
|
||||
while(idx--) {
|
||||
value = formatters[idx](value);
|
||||
}
|
||||
|
||||
if (ctrl.viewValue !== value) {
|
||||
ctrl.viewValue = value;
|
||||
ctrl.render();
|
||||
if (ctrl.$viewValue !== value) {
|
||||
ctrl.$viewValue = value;
|
||||
ctrl.$render();
|
||||
}
|
||||
});
|
||||
}];
|
||||
|
|
@ -915,7 +915,7 @@ var ngModelDirective = [function() {
|
|||
|
||||
forEach(['valid', 'invalid', 'pristine', 'dirty'], function(name) {
|
||||
scope.$watch(function() {
|
||||
return modelCtrl[name];
|
||||
return modelCtrl['$' + name];
|
||||
}, function(value) {
|
||||
element[value ? 'addClass' : 'removeClass']('ng-' + name);
|
||||
});
|
||||
|
|
@ -980,7 +980,7 @@ var ngModelDirective = [function() {
|
|||
var ngChangeDirective = valueFn({
|
||||
require: 'ngModel',
|
||||
link: function(scope, element, attr, ctrl) {
|
||||
ctrl.viewChangeListeners.push(function() {
|
||||
ctrl.$viewChangeListeners.push(function() {
|
||||
scope.$eval(attr.ngChange);
|
||||
});
|
||||
}
|
||||
|
|
@ -1025,7 +1025,7 @@ var ngModelInstantDirective = ['$browser', function($browser) {
|
|||
link: function(scope, element, attr, ctrl) {
|
||||
var handler = function() {
|
||||
scope.$apply(function() {
|
||||
ctrl.setViewValue(trim(element.val()));
|
||||
ctrl.$setViewValue(trim(element.val()));
|
||||
});
|
||||
};
|
||||
|
||||
|
|
@ -1058,19 +1058,19 @@ var requiredDirective = [function() {
|
|||
|
||||
var validator = function(value) {
|
||||
if (attr.required && (isEmpty(value) || value === false)) {
|
||||
ctrl.setValidity('REQUIRED', false);
|
||||
ctrl.$setValidity('REQUIRED', false);
|
||||
return;
|
||||
} else {
|
||||
ctrl.setValidity('REQUIRED', true);
|
||||
ctrl.$setValidity('REQUIRED', true);
|
||||
return value;
|
||||
}
|
||||
};
|
||||
|
||||
ctrl.formatters.push(validator);
|
||||
ctrl.parsers.unshift(validator);
|
||||
ctrl.$formatters.push(validator);
|
||||
ctrl.$parsers.unshift(validator);
|
||||
|
||||
attr.$observe('required', function() {
|
||||
validator(ctrl.viewValue);
|
||||
validator(ctrl.$viewValue);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
|
@ -1095,26 +1095,26 @@ var requiredDirective = [function() {
|
|||
}
|
||||
</script>
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
List: <input name="input" ng-model="names" ng-list required>
|
||||
<span class="error" ng-show="myForm.list.error.REQUIRED">
|
||||
List: <input name="namesInput" ng-model="names" ng-list required>
|
||||
<span class="error" ng-show="myForm.list.$error.REQUIRED">
|
||||
Required!</span>
|
||||
<tt>names = {{names}}</tt><br/>
|
||||
<tt>myForm.input.valid = {{myForm.input.valid}}</tt><br/>
|
||||
<tt>myForm.input.error = {{myForm.input.error}}</tt><br/>
|
||||
<tt>myForm.valid = {{myForm.valid}}</tt><br/>
|
||||
<tt>myForm.error.REQUIRED = {{!!myForm.error.REQUIRED}}</tt><br/>
|
||||
<tt>myForm.namesInput.$valid = {{myForm.namesInput.$valid}}</tt><br/>
|
||||
<tt>myForm.namesInput.$error = {{myForm.namesInput.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.REQUIRED = {{!!myForm.$error.REQUIRED}}</tt><br/>
|
||||
</form>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('names')).toEqual('["igor","misko","vojta"]');
|
||||
expect(binding('myForm.input.valid')).toEqual('true');
|
||||
expect(binding('myForm.namesInput.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('names').enter('');
|
||||
expect(binding('names')).toEqual('[]');
|
||||
expect(binding('myForm.input.valid')).toEqual('false');
|
||||
expect(binding('myForm.namesInput.$valid')).toEqual('false');
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
|
|
@ -1135,9 +1135,9 @@ var ngListDirective = function() {
|
|||
return list;
|
||||
};
|
||||
|
||||
ctrl.parsers.push(parse);
|
||||
ctrl.formatters.push(function(value) {
|
||||
if (isArray(value) && !equals(parse(ctrl.viewValue), value)) {
|
||||
ctrl.$parsers.push(parse);
|
||||
ctrl.$formatters.push(function(value) {
|
||||
if (isArray(value) && !equals(parse(ctrl.$viewValue), value)) {
|
||||
return value.join(', ');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -140,15 +140,15 @@ var selectDirective = ['$compile', '$parse', function($compile, $parse) {
|
|||
// required validator
|
||||
if (multiple && (attr.required || attr.ngRequired)) {
|
||||
var requiredValidator = function(value) {
|
||||
ctrl.setValidity('REQUIRED', !attr.required || (value && value.length));
|
||||
ctrl.$setValidity('REQUIRED', !attr.required || (value && value.length));
|
||||
return value;
|
||||
};
|
||||
|
||||
ctrl.parsers.push(requiredValidator);
|
||||
ctrl.formatters.unshift(requiredValidator);
|
||||
ctrl.$parsers.push(requiredValidator);
|
||||
ctrl.$formatters.unshift(requiredValidator);
|
||||
|
||||
attr.$observe('required', function() {
|
||||
requiredValidator(ctrl.viewValue);
|
||||
requiredValidator(ctrl.$viewValue);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -162,20 +162,20 @@ var selectDirective = ['$compile', '$parse', function($compile, $parse) {
|
|||
|
||||
|
||||
function Single(scope, selectElement, ctrl) {
|
||||
ctrl.render = function() {
|
||||
selectElement.val(ctrl.viewValue);
|
||||
ctrl.$render = function() {
|
||||
selectElement.val(ctrl.$viewValue);
|
||||
};
|
||||
|
||||
selectElement.bind('change', function() {
|
||||
scope.$apply(function() {
|
||||
ctrl.setViewValue(selectElement.val());
|
||||
ctrl.$setViewValue(selectElement.val());
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function Multiple(scope, selectElement, ctrl) {
|
||||
ctrl.render = function() {
|
||||
var items = new HashMap(ctrl.viewValue);
|
||||
ctrl.$render = function() {
|
||||
var items = new HashMap(ctrl.$viewValue);
|
||||
forEach(selectElement.children(), function(option) {
|
||||
option.selected = isDefined(items.get(option.value));
|
||||
});
|
||||
|
|
@ -189,7 +189,7 @@ var selectDirective = ['$compile', '$parse', function($compile, $parse) {
|
|||
array.push(option.value);
|
||||
}
|
||||
});
|
||||
ctrl.setViewValue(array);
|
||||
ctrl.$setViewValue(array);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
@ -266,11 +266,11 @@ var selectDirective = ['$compile', '$parse', function($compile, $parse) {
|
|||
value = valueFn(scope, locals);
|
||||
}
|
||||
}
|
||||
ctrl.setViewValue(value);
|
||||
ctrl.$setViewValue(value);
|
||||
});
|
||||
});
|
||||
|
||||
ctrl.render = render;
|
||||
ctrl.$render = render;
|
||||
|
||||
// TODO(vojta): can't we optimize this ?
|
||||
scope.$watch(render);
|
||||
|
|
@ -282,7 +282,7 @@ var selectDirective = ['$compile', '$parse', function($compile, $parse) {
|
|||
optionGroup,
|
||||
option,
|
||||
existingParent, existingOptions, existingOption,
|
||||
modelValue = ctrl.modelValue,
|
||||
modelValue = ctrl.$modelValue,
|
||||
values = valuesFn(scope) || [],
|
||||
keys = keyName ? sortedKeys(values) : values,
|
||||
groupLength, length,
|
||||
|
|
|
|||
|
|
@ -1,14 +1,14 @@
|
|||
'use strict';
|
||||
|
||||
describe('form', function() {
|
||||
var doc, widget, scope, $compile;
|
||||
var doc, control, scope, $compile;
|
||||
|
||||
beforeEach(module(function($compileProvider) {
|
||||
$compileProvider.directive('storeModelCtrl', function() {
|
||||
return {
|
||||
require: 'ngModel',
|
||||
link: function(scope, elm, attr, ctrl) {
|
||||
widget = ctrl;
|
||||
control = ctrl;
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
@ -33,17 +33,17 @@ describe('form', function() {
|
|||
|
||||
it('should remove the widget when element removed', function() {
|
||||
doc = $compile(
|
||||
'<form name="form">' +
|
||||
'<form name="myForm">' +
|
||||
'<input type="text" name="alias" ng-model="value" store-model-ctrl/>' +
|
||||
'</form>')(scope);
|
||||
|
||||
var form = scope.form;
|
||||
widget.setValidity('REQUIRED', false);
|
||||
expect(form.alias).toBe(widget);
|
||||
expect(form.error.REQUIRED).toEqual([widget]);
|
||||
var form = scope.myForm;
|
||||
control.$setValidity('REQUIRED', false);
|
||||
expect(form.alias).toBe(control);
|
||||
expect(form.$error.REQUIRED).toEqual([control]);
|
||||
|
||||
doc.find('input').remove();
|
||||
expect(form.error.REQUIRED).toBeUndefined();
|
||||
expect(form.$error.REQUIRED).toBeUndefined();
|
||||
expect(form.alias).toBeUndefined();
|
||||
});
|
||||
|
||||
|
|
@ -98,22 +98,22 @@ describe('form', function() {
|
|||
doc = jqLite(
|
||||
'<ng:form name="parent">' +
|
||||
'<ng:form name="child">' +
|
||||
'<input type="text" ng:model="text" name="text">' +
|
||||
'<input ng:model="modelA" name="inputA">' +
|
||||
'</ng:form>' +
|
||||
'</ng:form>');
|
||||
$compile(doc)(scope);
|
||||
|
||||
var parent = scope.parent;
|
||||
var child = scope.child;
|
||||
var input = child.text;
|
||||
var input = child.inputA;
|
||||
|
||||
input.setValidity('MyError', false);
|
||||
expect(parent.error.MyError).toEqual([child]);
|
||||
expect(child.error.MyError).toEqual([input]);
|
||||
input.$setValidity('MyError', false);
|
||||
expect(parent.$error.MyError).toEqual([child]);
|
||||
expect(child.$error.MyError).toEqual([input]);
|
||||
|
||||
input.setValidity('MyError', true);
|
||||
expect(parent.error.MyError).toBeUndefined();
|
||||
expect(child.error.MyError).toBeUndefined();
|
||||
input.$setValidity('MyError', true);
|
||||
expect(parent.$error.MyError).toBeUndefined();
|
||||
expect(child.$error.MyError).toBeUndefined();
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -131,10 +131,10 @@ describe('form', function() {
|
|||
|
||||
scope.$apply();
|
||||
|
||||
expect(scope.formA.error.REQUIRED.length).toBe(1);
|
||||
expect(scope.formA.error.REQUIRED).toEqual([scope.formA.firstName]);
|
||||
expect(scope.formB.error.REQUIRED.length).toBe(1);
|
||||
expect(scope.formB.error.REQUIRED).toEqual([scope.formB.lastName]);
|
||||
expect(scope.formA.$error.REQUIRED.length).toBe(1);
|
||||
expect(scope.formA.$error.REQUIRED).toEqual([scope.formA.firstName]);
|
||||
expect(scope.formB.$error.REQUIRED.length).toBe(1);
|
||||
expect(scope.formB.$error.REQUIRED).toEqual([scope.formB.lastName]);
|
||||
|
||||
var inputA = doc.find('input').eq(0),
|
||||
inputB = doc.find('input').eq(1);
|
||||
|
|
@ -147,8 +147,8 @@ describe('form', function() {
|
|||
expect(scope.firstName).toBe('val1');
|
||||
expect(scope.lastName).toBe('val2');
|
||||
|
||||
expect(scope.formA.error.REQUIRED).toBeUndefined();
|
||||
expect(scope.formB.error.REQUIRED).toBeUndefined();
|
||||
expect(scope.formA.$error.REQUIRED).toBeUndefined();
|
||||
expect(scope.formB.$error.REQUIRED).toBeUndefined();
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -173,14 +173,14 @@ describe('form', function() {
|
|||
expect(child).toBeDefined();
|
||||
expect(input).toBeDefined();
|
||||
|
||||
input.setValidity('myRule', false);
|
||||
expect(input.error.myRule).toEqual(true);
|
||||
expect(child.error.myRule).toEqual([input]);
|
||||
expect(parent.error.myRule).toEqual([child]);
|
||||
input.$setValidity('myRule', false);
|
||||
expect(input.$error.myRule).toEqual(true);
|
||||
expect(child.$error.myRule).toEqual([input]);
|
||||
expect(parent.$error.myRule).toEqual([child]);
|
||||
|
||||
input.setValidity('myRule', true);
|
||||
expect(parent.error.myRule).toBeUndefined();
|
||||
expect(child.error.myRule).toBeUndefined();
|
||||
input.$setValidity('myRule', true);
|
||||
expect(parent.$error.myRule).toBeUndefined();
|
||||
expect(child.$error.myRule).toBeUndefined();
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -190,10 +190,10 @@ describe('form', function() {
|
|||
|
||||
var widget = scope.form.w1;
|
||||
expect(widget).toBeDefined();
|
||||
expect(widget.pristine).toBe(true);
|
||||
expect(widget.dirty).toBe(false);
|
||||
expect(widget.valid).toBe(true);
|
||||
expect(widget.invalid).toBe(false);
|
||||
expect(widget.$pristine).toBe(true);
|
||||
expect(widget.$dirty).toBe(false);
|
||||
expect(widget.$valid).toBe(true);
|
||||
expect(widget.$invalid).toBe(false);
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -202,7 +202,7 @@ describe('form', function() {
|
|||
beforeEach(function() {
|
||||
doc = $compile(
|
||||
'<form name="form">' +
|
||||
'<input type="text" ng-model="name" name="name" store-model-ctrl/>' +
|
||||
'<input ng-model="name" name="name" store-model-ctrl/>' +
|
||||
'</form>')(scope);
|
||||
|
||||
scope.$digest();
|
||||
|
|
@ -212,18 +212,18 @@ describe('form', function() {
|
|||
it('should have ng-valid/ng-invalid css class', function() {
|
||||
expect(doc).toBeValid();
|
||||
|
||||
widget.setValidity('ERROR', false);
|
||||
control.$setValidity('ERROR', false);
|
||||
scope.$apply();
|
||||
expect(doc).toBeInvalid();
|
||||
|
||||
widget.setValidity('ANOTHER', false);
|
||||
control.$setValidity('ANOTHER', false);
|
||||
scope.$apply();
|
||||
|
||||
widget.setValidity('ERROR', true);
|
||||
control.$setValidity('ERROR', true);
|
||||
scope.$apply();
|
||||
expect(doc).toBeInvalid();
|
||||
|
||||
widget.setValidity('ANOTHER', true);
|
||||
control.$setValidity('ANOTHER', true);
|
||||
scope.$apply();
|
||||
expect(doc).toBeValid();
|
||||
});
|
||||
|
|
@ -232,7 +232,7 @@ describe('form', function() {
|
|||
it('should have ng-pristine/ng-dirty css class', function() {
|
||||
expect(doc).toBePristine();
|
||||
|
||||
widget.setViewValue('');
|
||||
control.$setViewValue('');
|
||||
scope.$apply();
|
||||
expect(doc).toBeDirty();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -19,18 +19,18 @@ describe('NgModelController', function() {
|
|||
|
||||
|
||||
it('should init the properties', function() {
|
||||
expect(ctrl.dirty).toBe(false);
|
||||
expect(ctrl.pristine).toBe(true);
|
||||
expect(ctrl.valid).toBe(true);
|
||||
expect(ctrl.invalid).toBe(false);
|
||||
expect(ctrl.$dirty).toBe(false);
|
||||
expect(ctrl.$pristine).toBe(true);
|
||||
expect(ctrl.$valid).toBe(true);
|
||||
expect(ctrl.$invalid).toBe(false);
|
||||
|
||||
expect(ctrl.viewValue).toBeDefined();
|
||||
expect(ctrl.modelValue).toBeDefined();
|
||||
expect(ctrl.$viewValue).toBeDefined();
|
||||
expect(ctrl.$modelValue).toBeDefined();
|
||||
|
||||
expect(ctrl.formatters).toEqual([]);
|
||||
expect(ctrl.parsers).toEqual([]);
|
||||
expect(ctrl.$formatters).toEqual([]);
|
||||
expect(ctrl.$parsers).toEqual([]);
|
||||
|
||||
expect(ctrl.name).toBe('testAlias');
|
||||
expect(ctrl.$name).toBe('testAlias');
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -40,40 +40,40 @@ describe('NgModelController', function() {
|
|||
var spy = jasmine.createSpy('setValidity');
|
||||
ctrl.$form = {$setValidity: spy};
|
||||
|
||||
ctrl.setValidity('ERROR', false);
|
||||
ctrl.$setValidity('ERROR', false);
|
||||
expect(spy).toHaveBeenCalledOnceWith('ERROR', false, ctrl);
|
||||
|
||||
spy.reset();
|
||||
ctrl.setValidity('ERROR', false);
|
||||
ctrl.$setValidity('ERROR', false);
|
||||
expect(spy).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
|
||||
it('should set and unset the error', function() {
|
||||
ctrl.setValidity('REQUIRED', false);
|
||||
expect(ctrl.error.REQUIRED).toBe(true);
|
||||
ctrl.$setValidity('REQUIRED', false);
|
||||
expect(ctrl.$error.REQUIRED).toBe(true);
|
||||
|
||||
ctrl.setValidity('REQUIRED', true);
|
||||
expect(ctrl.error.REQUIRED).toBeUndefined();
|
||||
ctrl.$setValidity('REQUIRED', true);
|
||||
expect(ctrl.$error.REQUIRED).toBeUndefined();
|
||||
});
|
||||
|
||||
|
||||
it('should set valid/invalid', function() {
|
||||
ctrl.setValidity('FIRST', false);
|
||||
expect(ctrl.valid).toBe(false);
|
||||
expect(ctrl.invalid).toBe(true);
|
||||
ctrl.$setValidity('FIRST', false);
|
||||
expect(ctrl.$valid).toBe(false);
|
||||
expect(ctrl.$invalid).toBe(true);
|
||||
|
||||
ctrl.setValidity('SECOND', false);
|
||||
expect(ctrl.valid).toBe(false);
|
||||
expect(ctrl.invalid).toBe(true);
|
||||
ctrl.$setValidity('SECOND', false);
|
||||
expect(ctrl.$valid).toBe(false);
|
||||
expect(ctrl.$invalid).toBe(true);
|
||||
|
||||
ctrl.setValidity('SECOND', true);
|
||||
expect(ctrl.valid).toBe(false);
|
||||
expect(ctrl.invalid).toBe(true);
|
||||
ctrl.$setValidity('SECOND', true);
|
||||
expect(ctrl.$valid).toBe(false);
|
||||
expect(ctrl.$invalid).toBe(true);
|
||||
|
||||
ctrl.setValidity('FIRST', true);
|
||||
expect(ctrl.valid).toBe(true);
|
||||
expect(ctrl.invalid).toBe(false);
|
||||
ctrl.$setValidity('FIRST', true);
|
||||
expect(ctrl.$valid).toBe(true);
|
||||
expect(ctrl.$invalid).toBe(false);
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -81,13 +81,13 @@ describe('NgModelController', function() {
|
|||
var spy = jasmine.createSpy('setValidity');
|
||||
ctrl.$form = {$setValidity: spy};
|
||||
|
||||
ctrl.setValidity('ERROR', true);
|
||||
ctrl.$setValidity('ERROR', true);
|
||||
expect(spy).not.toHaveBeenCalled();
|
||||
|
||||
ctrl.setValidity('ERROR', false);
|
||||
ctrl.$setValidity('ERROR', false);
|
||||
expect(spy).toHaveBeenCalledOnceWith('ERROR', false, ctrl);
|
||||
spy.reset();
|
||||
ctrl.setValidity('ERROR', true);
|
||||
ctrl.$setValidity('ERROR', true);
|
||||
expect(spy).toHaveBeenCalledOnceWith('ERROR', true, ctrl);
|
||||
});
|
||||
});
|
||||
|
|
@ -96,54 +96,54 @@ describe('NgModelController', function() {
|
|||
describe('view -> model', function() {
|
||||
|
||||
it('should set the value to $viewValue', function() {
|
||||
ctrl.setViewValue('some-val');
|
||||
expect(ctrl.viewValue).toBe('some-val');
|
||||
ctrl.$setViewValue('some-val');
|
||||
expect(ctrl.$viewValue).toBe('some-val');
|
||||
});
|
||||
|
||||
|
||||
it('should pipeline all registered parsers and set result to $modelValue', function() {
|
||||
var log = [];
|
||||
|
||||
ctrl.parsers.push(function(value) {
|
||||
ctrl.$parsers.push(function(value) {
|
||||
log.push(value);
|
||||
return value + '-a';
|
||||
});
|
||||
|
||||
ctrl.parsers.push(function(value) {
|
||||
ctrl.$parsers.push(function(value) {
|
||||
log.push(value);
|
||||
return value + '-b';
|
||||
});
|
||||
|
||||
ctrl.setViewValue('init');
|
||||
ctrl.$setViewValue('init');
|
||||
expect(log).toEqual(['init', 'init-a']);
|
||||
expect(ctrl.modelValue).toBe('init-a-b');
|
||||
expect(ctrl.$modelValue).toBe('init-a-b');
|
||||
});
|
||||
|
||||
|
||||
it('should fire viewChangeListeners when the value changes in the view (even if invalid)',
|
||||
function() {
|
||||
var spy = jasmine.createSpy('viewChangeListener');
|
||||
ctrl.viewChangeListeners.push(spy);
|
||||
ctrl.setViewValue('val');
|
||||
ctrl.$viewChangeListeners.push(spy);
|
||||
ctrl.$setViewValue('val');
|
||||
expect(spy).toHaveBeenCalledOnce();
|
||||
spy.reset();
|
||||
|
||||
// invalid
|
||||
ctrl.parsers.push(function() {return undefined;});
|
||||
ctrl.setViewValue('val');
|
||||
ctrl.$parsers.push(function() {return undefined;});
|
||||
ctrl.$setViewValue('val');
|
||||
expect(spy).toHaveBeenCalledOnce();
|
||||
});
|
||||
|
||||
|
||||
it('should reset the model when the view is invalid', function() {
|
||||
ctrl.setViewValue('aaaa');
|
||||
expect(ctrl.modelValue).toBe('aaaa');
|
||||
ctrl.$setViewValue('aaaa');
|
||||
expect(ctrl.$modelValue).toBe('aaaa');
|
||||
|
||||
// add a validator that will make any input invalid
|
||||
ctrl.parsers.push(function() {return undefined;});
|
||||
expect(ctrl.modelValue).toBe('aaaa');
|
||||
ctrl.setViewValue('bbbb');
|
||||
expect(ctrl.modelValue).toBeUndefined;
|
||||
ctrl.$parsers.push(function() {return undefined;});
|
||||
expect(ctrl.$modelValue).toBe('aaaa');
|
||||
ctrl.$setViewValue('bbbb');
|
||||
expect(ctrl.$modelValue).toBeUndefined;
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -151,15 +151,15 @@ describe('NgModelController', function() {
|
|||
var spy = jasmine.createSpy('setDirty');
|
||||
ctrl.$form = {$setDirty: spy};
|
||||
|
||||
ctrl.setViewValue('');
|
||||
expect(ctrl.pristine).toBe(false);
|
||||
expect(ctrl.dirty).toBe(true);
|
||||
ctrl.$setViewValue('');
|
||||
expect(ctrl.$pristine).toBe(false);
|
||||
expect(ctrl.$dirty).toBe(true);
|
||||
expect(spy).toHaveBeenCalledOnce();
|
||||
|
||||
spy.reset();
|
||||
ctrl.setViewValue('');
|
||||
expect(ctrl.pristine).toBe(false);
|
||||
expect(ctrl.dirty).toBe(true);
|
||||
ctrl.$setViewValue('');
|
||||
expect(ctrl.$pristine).toBe(false);
|
||||
expect(ctrl.$dirty).toBe(true);
|
||||
expect(spy).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
|
@ -171,7 +171,7 @@ describe('NgModelController', function() {
|
|||
scope.$apply(function() {
|
||||
scope.value = 10;
|
||||
});
|
||||
expect(ctrl.modelValue).toBe(10);
|
||||
expect(ctrl.$modelValue).toBe(10);
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -179,12 +179,12 @@ describe('NgModelController', function() {
|
|||
function() {
|
||||
var log = [];
|
||||
|
||||
ctrl.formatters.unshift(function(value) {
|
||||
ctrl.$formatters.unshift(function(value) {
|
||||
log.push(value);
|
||||
return value + 2;
|
||||
});
|
||||
|
||||
ctrl.formatters.unshift(function(value) {
|
||||
ctrl.$formatters.unshift(function(value) {
|
||||
log.push(value);
|
||||
return value + '';
|
||||
});
|
||||
|
|
@ -193,35 +193,35 @@ describe('NgModelController', function() {
|
|||
scope.value = 3;
|
||||
});
|
||||
expect(log).toEqual([3, 5]);
|
||||
expect(ctrl.viewValue).toBe('5');
|
||||
expect(ctrl.$viewValue).toBe('5');
|
||||
});
|
||||
|
||||
|
||||
it('should $render only if value changed', function() {
|
||||
spyOn(ctrl, 'render');
|
||||
spyOn(ctrl, '$render');
|
||||
|
||||
scope.$apply(function() {
|
||||
scope.value = 3;
|
||||
});
|
||||
expect(ctrl.render).toHaveBeenCalledOnce();
|
||||
ctrl.render.reset();
|
||||
expect(ctrl.$render).toHaveBeenCalledOnce();
|
||||
ctrl.$render.reset();
|
||||
|
||||
ctrl.formatters.push(function() {return 3;});
|
||||
ctrl.$formatters.push(function() {return 3;});
|
||||
scope.$apply(function() {
|
||||
scope.value = 5;
|
||||
});
|
||||
expect(ctrl.render).not.toHaveBeenCalled();
|
||||
expect(ctrl.$render).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
|
||||
it('should clear the view even if invalid', function() {
|
||||
spyOn(ctrl, 'render');
|
||||
spyOn(ctrl, '$render');
|
||||
|
||||
ctrl.formatters.push(function() {return undefined;});
|
||||
ctrl.$formatters.push(function() {return undefined;});
|
||||
scope.$apply(function() {
|
||||
scope.value = 5;
|
||||
});
|
||||
expect(ctrl.render).toHaveBeenCalledOnce();
|
||||
expect(ctrl.$render).toHaveBeenCalledOnce();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -296,10 +296,10 @@ describe('input', function() {
|
|||
compileInput('<input ng-model="name" name="alias" required>');
|
||||
|
||||
scope.$apply();
|
||||
expect(scope.form.error.REQUIRED.length).toBe(1);
|
||||
expect(scope.form.$error.REQUIRED.length).toBe(1);
|
||||
|
||||
inputElm.remove();
|
||||
expect(scope.form.error.REQUIRED).toBeUndefined();
|
||||
expect(scope.form.$error.REQUIRED).toBeUndefined();
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -535,12 +535,12 @@ describe('input', function() {
|
|||
changeInputValueTo('1');
|
||||
expect(inputElm).toBeInvalid();
|
||||
expect(scope.value).toBeFalsy();
|
||||
expect(scope.form.alias.error.MIN).toBeTruthy();
|
||||
expect(scope.form.alias.$error.MIN).toBeTruthy();
|
||||
|
||||
changeInputValueTo('100');
|
||||
expect(inputElm).toBeValid();
|
||||
expect(scope.value).toBe(100);
|
||||
expect(scope.form.alias.error.MIN).toBeFalsy();
|
||||
expect(scope.form.alias.$error.MIN).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -554,12 +554,12 @@ describe('input', function() {
|
|||
changeInputValueTo('20');
|
||||
expect(inputElm).toBeInvalid();
|
||||
expect(scope.value).toBeFalsy();
|
||||
expect(scope.form.alias.error.MAX).toBeTruthy();
|
||||
expect(scope.form.alias.$error.MAX).toBeTruthy();
|
||||
|
||||
changeInputValueTo('0');
|
||||
expect(inputElm).toBeValid();
|
||||
expect(scope.value).toBe(0);
|
||||
expect(scope.form.alias.error.MAX).toBeFalsy();
|
||||
expect(scope.form.alias.$error.MAX).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -572,7 +572,7 @@ describe('input', function() {
|
|||
changeInputValueTo('0');
|
||||
expect(inputElm).toBeValid();
|
||||
expect(scope.value).toBe(0);
|
||||
expect(scope.form.alias.error.REQUIRED).toBeFalsy();
|
||||
expect(scope.form.alias.$error.REQUIRED).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should be valid even if value 0 is set from model', function() {
|
||||
|
|
@ -584,7 +584,7 @@ describe('input', function() {
|
|||
|
||||
expect(inputElm).toBeValid();
|
||||
expect(inputElm.val()).toBe('0')
|
||||
expect(scope.form.alias.error.REQUIRED).toBeFalsy();
|
||||
expect(scope.form.alias.$error.REQUIRED).toBeFalsy();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -599,12 +599,12 @@ describe('input', function() {
|
|||
|
||||
expect(scope.email).toBe('vojta@google.com');
|
||||
expect(inputElm).toBeValid();
|
||||
expect(widget.error.EMAIL).toBeUndefined();
|
||||
expect(widget.$error.EMAIL).toBeUndefined();
|
||||
|
||||
changeInputValueTo('invalid@');
|
||||
expect(scope.email).toBeUndefined();
|
||||
expect(inputElm).toBeInvalid();
|
||||
expect(widget.error.EMAIL).toBeTruthy();
|
||||
expect(widget.$error.EMAIL).toBeTruthy();
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -627,12 +627,12 @@ describe('input', function() {
|
|||
changeInputValueTo('http://www.something.com');
|
||||
expect(scope.url).toBe('http://www.something.com');
|
||||
expect(inputElm).toBeValid();
|
||||
expect(widget.error.URL).toBeUndefined();
|
||||
expect(widget.$error.URL).toBeUndefined();
|
||||
|
||||
changeInputValueTo('invalid.com');
|
||||
expect(scope.url).toBeUndefined();
|
||||
expect(inputElm).toBeInvalid();
|
||||
expect(widget.error.URL).toBeTruthy();
|
||||
expect(widget.$error.URL).toBeTruthy();
|
||||
});
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ describe('select', function() {
|
|||
scope.selection = 'c';
|
||||
});
|
||||
|
||||
expect(scope.form.select.error.REQUIRED).toBeFalsy();
|
||||
expect(scope.form.select.$error.REQUIRED).toBeFalsy();
|
||||
expect(element).toBeValid();
|
||||
expect(element).toBePristine();
|
||||
|
||||
|
|
@ -63,7 +63,7 @@ describe('select', function() {
|
|||
scope.selection = '';
|
||||
});
|
||||
|
||||
expect(scope.form.select.error.REQUIRED).toBeTruthy();
|
||||
expect(scope.form.select.$error.REQUIRED).toBeTruthy();
|
||||
expect(element).toBeInvalid();
|
||||
expect(element).toBePristine();
|
||||
expect(scope.log).toEqual('');
|
||||
|
|
@ -117,7 +117,7 @@ describe('select', function() {
|
|||
scope.selection = [];
|
||||
});
|
||||
|
||||
expect(scope.form.select.error.REQUIRED).toBeTruthy();
|
||||
expect(scope.form.select.$error.REQUIRED).toBeTruthy();
|
||||
expect(element).toBeInvalid();
|
||||
expect(element).toBePristine();
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue