指令angularjs查邮件或不使用 [英] directive angularjs to check mail used or not
本文介绍了指令angularjs查邮件或不使用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我要检查邮件是否已使用或不（与后端通信），但在屏幕上没有显示错误信息。
在verficiation功能服务：
demoApp.factory（'verifyEmail'，函数（$ HTTP）{
复位功能（邮件）{
VAR测试=邮件;
VAR urll =？HTTP：//本地主机：8080 /应用/ personne / verifmail味精=;
VAR aplrest = urll +测试;
VAR CH3 = aplrest; 返回$ http.post（CH 3）
};}）;
的
demoApp.directive（'existTo'，[$ Q，verifyEmail功能（$ Q，verifyEmail）{
返回{
要求：ngModel
范围： {
otherModelValue：= existTo
}，
链接：功能（范围，元素，属性，ngModel）{
//注意改变$ asyncValidators此处＆lt; -------------
ngModel。$ asyncValidators.existTo =功能（modelValue）{
变种推迟= $ q.defer（）;
verifyEmail（modelValue）。然后（功能（respons）{
//将respons可以{存在=真}或{存在=假}
VAR代表= respons.exist;
deferred.resolve（REP）;
}）;
返回deferred.promise;
};
范围。$表（otherModelValue功能（）{
ngModel $的validate（）。
}）;
}
}; }]）;
HTML文件：
＆LT;标签＆gt;电子邮件和LT; /标签＆gt;
＆LT;输入类型=电子邮件NAME =电子邮件级=表单组
NG-模式=registration.user.email
NG-模式=/ ^ [_ A-Z0-9] +（\\ [_ A-Z0-9] +）* @ [A-Z0-9 - ] +（\\ [A-Z0-9 - ] + ）*（\\。[AZ] {2,8}）$ /
要求存在 - 要=registration.user.email/＆GT; ＆LT;跨度风格=颜色：红色的NG-秀=。registrationForm.email $脏放大器;＆安培; registrationForm.email $无效＆GT;
＆LT;跨度NG秀=$ registrationForm.email error.required。＆GT;香榭丽舍大街的电子邮件obligatoire＆LT; / SPAN＆GT;
＆LT;跨度NG秀=$ registrationForm.email error.pattern方式＆gt;电子邮件地址无效＆LT; / SPAN＆GT;
＆LT;跨度NG秀=$ registrationForm.email error.existTo。＆GT;邮件已经存在＆LT; / SPAN＆GT;
＆LT; / SPAN＆GT;
解决方案
此解决方案
demoApp.directive（'existTo'，[$ Q，verifyEmail功能（$ Q，verifyEmail）{
返回{
要求：ngModel
范围： {
otherModelValue：= existTo
}，
链接：功能（范围，元素，属性，ngModel）{
//注意改变$ asyncValidators此处＆lt; -------------
ngModel。$ asyncValidators.existTo =功能（modelValue）{
变种推迟= $ q.defer（）;
// window.alert（L电子邮件测试仪+ modelValue）;
verifyEmail（modelValue）.success（功能（respons）{
//将respons可以{存在=真}或{存在=假}
// window.alert（香格里拉效应初探+ respons）;
VAR代表= respons.exist;
// window.alert（香格里拉效应初探+ REP）; 如果（代表==假）{
//用户名可用
deferred.resolve（）;
}其他{
deferred.reject（）;
} }）;
返回deferred.promise;
};
范围。$表（otherModelValue功能（）{
ngModel $的validate（）。
}）;
}
}; }]）;
i want to check if email is already used or not (communication with back-end) but the error message is not shown in the screen.
the verficiation function service :
demoApp.factory('verifyEmail', function($http) {
return function(mail) {
var test=mail;
var urll="http://localhost:8080/app/personne/verifmail?msg=";
var aplrest=urll+test;
var ch3=aplrest;
return $http.post(ch3)
};});
the directive (with the help of @jsonmurphy)
demoApp.directive('existTo', ["$q","verifyEmail",function ($q, verifyEmail) {
return {
require: "ngModel",
scope: {
otherModelValue: "=existTo"
},
link: function(scope, element, attributes, ngModel) {
// Note the change to $asyncValidators here <-------------
ngModel.$asyncValidators.existTo = function(modelValue) {
var deferred = $q.defer();
verifyEmail(modelValue).then(function(respons) {
// the respons can be {exist="true"} or{exist="false"}
var rep=respons.exist;
deferred.resolve(rep);
});
return deferred.promise;
};
scope.$watch("otherModelValue", function() {
ngModel.$validate();
});
}
}; }]);
the html file:
<label>Email</label>
<input type="email" name="email" class="form-group"
ng-model="registration.user.email"
ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,8})$/"
required exist-To="registration.user.email"/>
<span style="color:red" ng-show="registrationForm.email.$dirty && registrationForm.email.$invalid">
<span ng-show="registrationForm.email.$error.required">champs email obligatoire.</span>
<span ng-show="registrationForm.email.$error.pattern">Invalid email address.</span>
<span ng-show="registrationForm.email.$error.existTo">mail already exist.</span>
</span>
解决方案
this the solution
demoApp.directive('existTo', ["$q","verifyEmail",function ($q, verifyEmail) {
return {
require: "ngModel",
scope: {
otherModelValue: "=existTo"
},
link: function(scope, element, attributes, ngModel) {
// Note the change to $asyncValidators here <-------------
ngModel.$asyncValidators.existTo = function(modelValue) {
var deferred = $q.defer();
// window.alert("l email a tester "+modelValue);
verifyEmail(modelValue).success(function(respons) {
// the respons can be {exist="true"} or{exist="false"}
// window.alert("la reponse " +respons);
var rep=respons.exist;
// window.alert("la reponse " +rep);
if (rep =="false") {
// The username is available
deferred.resolve();
} else {
deferred.reject();
}
});
return deferred.promise;
};
scope.$watch("otherModelValue", function() {
ngModel.$validate();
});
}
}; }]);
这篇关于指令angularjs查邮件或不使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
