您将如何去禁用或至少改变Angular如何验证type = email输入?
目前,如果您使用type = email,Angular基本上双重验证..作为浏览器(在这种情况下为Chrome)验证电子邮件,然后角度也是.不仅如此,但是在Chrome foo @ bar中有效的在Angularjs中无效.
我可以找到最好的是ng模式,但是ng模式只是为输入类型添加了第三种模式验证,而不是替换Angular的电子邮件验证.嘿嘿
有任何想法吗?
注意:这是例如角1.2.0-rc.3.其他版本的内容可能会有所不同
像其他人一样说,关闭角度默认输入验证有点复杂.您需要将自己的指令添加到输入元素并处理其中的内容. Sergey’s answer是正确的,但如果您在元素上需要多个验证器,并且不希望内置验证器触发,则会出现一些问题.
以下是验证添加了所需验证器的电子邮件字段的示例.我已经添加了代码来解释发生了什么.
输入元素
<input type="email" required>
指示
angular.module('myValidations',[]) .directive('input',function () { var self = { // we use ?ngModel since not all input elements // specify a model,e.g. type="submit" require: '?ngModel' // we need to set the priority higher than the base 0,otherwise the // built in directive will still be applied,priority: 1 // restrict this directive to elements,restrict: 'E',link: function (scope,element,attrs,controller) { // as stated above,a controller may not be present if (controller) { // in this case we only want to override the email validation if (attrs.type === 'email') { // clear this elements $parsers and $formatters // NOTE: this will disable *ALL* prevIoUsly set parsers // and validators for this element. Beware! controller.$parsers = []; controller.$formatters = []; // this function handles the actual validation // see angular docs on how to write custom validators // http://docs.angularjs.org/guide/forms // // in this example we are not going to actually validate an email // properly since the regex can be damn long,so apply your own rules var validateEmail = function (value) { console.log("Validating as email",value); if (controller.$isEmpty(value) || /@/.test(value)) { controller.$setValidity('email',true); return value; } else { controller.$setValidity('email',false); return undefined; } }; // add the validator to the $parsers and $formatters controller.$parsers.push(validateEmail); controller.$formatters.push(validateEmail); } } } }; return self; }) // define our required directive. It is a pretty standard // validation directive with the exception of it's priority. // a similar approach must be take with all validation directives // you would want to use alongside our `input` directive .directive('required',function () { var self = { // required should always be applied to a model element require: 'ngModel',restrict: 'A' // The priority needs to be higher than the `input` directive // above,or it will be removed when that directive is run,priority: 2,controller) { var validaterequired = function (value) { if (value) { // it is valid controller.$setValidity('required',true); return value; } else { // it is invalid,return undefined (no model update) controller.$setValidity('required',false); return undefined; } }; controller.$parsers.push(validaterequired); } }; return self; }) ;
你有它您现在可以控制type =“email”输入验证.请使用正确的正则表达式来测试电子邮件.
需要注意的是,在此示例中,validateEmail在validaterequired之前运行.如果您需要validaterequired在任何其他验证之前运行,那么只需将其添加到$parsers数组(使用unshift而不是push)即可.