3
我想写我自己的一套指令。我已经写了以下两条指令：多个验证指令不起作用
- eaValidateEmail（验证的电子邮件地址的格式）
- eaValidateUnique（将要休息服务的呼叫一旦完成验证的唯一性）
什么我想实现：
- 首先执行eaValidateEmail指令，该指令返回false直到e邮件是正确的
- 然后，只有然后eaValidateUnique指令应执行并检查电子邮件地址是否已经通过休息服务。如果未找到该值，则返回true，否则返回false。
发生了什么事
当我只加了eaValidateEmail指令，一切工作和电子邮件的形式进行验证。
但是一旦我添加了eaValidateUnique指令，那么eaValidateEmail指令就被省略了，并且eaValidateUnique指令的ctrl。$ valid方法总是传递，即使ctrl。$ valid在console.log中为false。
我已阅读AngularJS文档，买了两本书，但例子总是非常基本。目前我无法弄清楚问题出在哪里。它看起来像是与ngModelController冲突，但我无法找出解决此问题的正确方法。
我目前正在使用ValidateCtrlNew表单进行测试。所以这个字段在html表单的“新建”部分。
问题：
- 是否有人知道，让他们在串行顺序，我将它们添加的属性中输入元素执行怎么写的指令？
- 如何防止与指令冲突？隔离范围也不适用于多个指令。
这里是的jsfiddle：http://jsfiddle.net/charms/6j3U8/230/
<div ng-controller="ValidateCtrlNew">
<form name="user_form_new" class="pure-form" novalidate>
<fieldset>
<legend>New</legend>
<input type="text" name="email" ng-model="user.email" placeholder="E-Mail" class="txt_fld" ng-required="true" ea-validate-email ea-validate-unique/><br/>
<div class="inv_msg" ng-show="user_form_new.email.$dirty && user_form_new.email.$invalid">Invalid:
<span ng-show="user_form_new.email.$error.required">Please enter your email.</span>
<span ng-show="user_form_new.email.$error.eaValidateEmail">This is not a valid email.</span>
<span ng-show="user_form_new.email.$error.eaValidateEmailCheck">Checking email....</span>
<span ng-show="user_form_new.email.$error.eaValidateUnique">This email is already taken.</span>
</div>
</fieldset>
</form>
</div>
.directive('eaValidateUnique', ['$http', function($http) {
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, elem, attr, ctrl) {
ctrl.$parsers.push(function(viewValue) {
console.log(ctrl);
//ctrl.$setValidity('eaValidateUnique', true);
if(ctrl.$valid) {
ctrl.$setValidity('eaValidateUnique', false);
console.log("valid was true");
}
});
}
};
}])
.directive('eaValidateEmail', [function() {
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, elem, attr, ctrl) {
var EMAIL_REGEXP = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
ctrl.$parsers.push(function(viewValue) {
// set validity to true to clear out if previous validators fail
ctrl.$setValidity('eaValidateEmail', true);
if(ctrl.$valid) {
// set validity to false as we need to check the value here
ctrl.$setValidity('eaValidateEmail', false);
if(viewValue !== undefined && viewValue !== "" && EMAIL_REGEXP.test(viewValue)) {
// if the format of the email is valid then we set validity to true
ctrl.$setValidity('eaValidateEmail', true);
ctrl.$setValidity('eaValidateEmailCheck', true);
console.log("TRUE");
} else {
// if the format of the email is invalid we set validity to false
ctrl.$setValidity('eaValidateEmail', false);
ctrl.$setValidity('eaValidateEmailCheck', true);
console.log("FALSE");
}
}
return viewValue;
});
}
};
}]);