Page 113 - AngularJS权威教程

10.6 自定义验证 93

6. $error 1
$error对象中保存着没有通过验证的验证器名称以及对应的错误信息。

7. $pristine 2
$pristine的值是布尔型的，可以告诉我们用户是否对控件进行了修改。
3
8. $dirty

$dirty的值和$pristine相反，可以告诉我们用户是否和控件进行过交互。
4
9. $valid
$valid值可以告诉我们当前的控件中是否有错误。当有错误时值为false，没有错误时值为true。 5

10. $invalid
6
$invalid值可以告诉我们当前控件中是否存在至少一个错误，它的值和$valid相反。

10.6 自定义验证 7

前面验证章节介绍过如何使用指令创建自定义验证。使用AngularJS可以方便地通过指令添 8
加自定义验证。例如，我们需要验证username在数据库中是否合法，可以实现一个指令，用来在
表单发生变化时发送Ajax请求：
9
angular.module('validationExample', [])
.directive('ensureUnique',function($http) {
return { 10
require: 'ngModel',
link: function(scope, ele, attrs, c) {
scope.$watch(attrs.ngModel, function() { 11
$http({
method: 'POST',
url: '/api/check/' + attrs.ensureUnique,
data: {field: attrs.ensureUnique, valud:scope.ngModel 12
}).success(function(data,status,headers,cfg) {
c.$setValidity('unique', data.isUnique);
}).error(function(data,status,headers,cfg) { 13
c.$setValidity('unique', false);
});
});
} 14
};
});
15
出于演示目的，尽管我们在指令内置入了一个$http调用，但是在产品中的指令
内使用$http是不明智的。相反，将它置入到服务中会更好。关于服务的更多信 16
息请参第14章。

可以像使用其他AngularJS的内置验证一样来使用这个自定义验证，如下所示： 17

<input type="text"
placeholder="Desired username"
name="username" 18