由于如果您使用Google“ AngularFormValidation”,这是最好的结果之一,所以我想为从那里来的任何人添加另一个答案。
FormController。$ setValidity中有一个方法,但是它看起来不像公共API,所以我宁愿不使用它。
这是“公开”的,不用担心。用它。这就是它的目的。如果不打算使用它,Angular开发人员将把它私有化。
要进行自定义验证,如果您不想使用Angular-UI作为其他建议的答案,则可以简单地滚动自己的验证指令。
app.directive('blacklist', function (){
return {
require: 'ngModel',
link: function(scope, elem, attr, ngModel) {
var blacklist = attr.blacklist.split(',');
//For DOM -> model validation
ngModel.$parsers.unshift(function(value) {
var valid = blacklist.indexOf(value) === -1;
ngModel.$setValidity('blacklist', valid);
return valid ? value : undefined;
});
//For model -> DOM validation
ngModel.$formatters.unshift(function(value) {
ngModel.$setValidity('blacklist', blacklist.indexOf(value) === -1);
return value;
});
}
};
});
这是一些用法示例:
<form name="myForm" ng-submit="doSomething()">
<input type="text" name="fruitName" ng-model="data.fruitName" blacklist="coconuts,bananas,pears" required/>
<span ng-show="myForm.fruitName.$error.blacklist">
The phrase "{{data.fruitName}}" is blacklisted</span>
<span ng-show="myForm.fruitName.$error.required">required</span>
<button type="submit" ng-disabled="myForm.$invalid">Submit</button>
</form>
这是强制性的链接
另外,我已经写了一些关于该主题的博客条目,其中涉及了更多细节:
现在,您可以使用ngMessages模块而不是ngShow来显示错误消息。它实际上可以与任何东西一起使用,它不一定是错误消息,但是这里是基础知识:
ngMessages
模块声明中的参考:
var app = angular.module('myApp', ['ngMessages']);
<form name="personForm">
<input type="email" name="email" ng-model="person.email" required/>
<div ng-messages="personForm.email.$error">
<div ng-message="required">required</div>
<div ng-message="email">invalid email</div>
</div>
</form>
在上面的标记中,ng-message="personForm.email.$error"
基本上为ng-message
子指令指定了上下文。然后ng-message="required"
,ng-message="email"
在该上下文上指定要监视的属性。 。它在列表中找到的第一个“真实”获胜,它将显示该消息,而没有其他消息。