Angularjs Methods for verifying duplicate passwords (two) _angularjs

This article gives you two ways to share angularjs validation of duplicate passwords. Details of the specific method are as follows:

First type:

<label for= "password" > Password </label> <input id= "password" name= "password" type= "password" ng-model= "
User.password "required>
<label for=" Repassword "> Duplicate password </label>
<input id=" Repassword " Name= "Repassword" type= "password" ng-model= "Repassword" required> <span style= "color:red" ng-show= "
User.password!=repassword "> Two password inconsistency </span>
<input type=" Submit "class=" BTN btn-primary btn-lg "value = "SAVE" ng-disabled= "Submit (UserForm)"/>
/*js*/
app.controller ("main", function ($scope) {
$ Scope.submit=function (Ngformcontroller) {return
ngformcontroller. $invalid;/*valid's Take-back */
};

This is simply to determine whether the value of the two Ng-model is equal, unequal to show the ng-show Command control information, etc. are hidden.

But while this approach is simple, there is a flaw that I think is more serious: this "password inconsistency" does not affect the interior of the Ngformcontroller. That is, even if it is incorrectly coded twice, the final submit button can be clicked, because Ngformcontroller's $invalid does not think two passwords incorrectly are a mistake.

Refer to the ANGULARJS instructions Ng-maxlength and so on, they can cause $invalid detection, so to solve the above problem, I think one of the ways is to create a two password to verify the consistency of the custom instructions.

/* directive creation/app.directive (' Equals ', function () {return{require: ' Ngmodel ', link:function (Scope,elm,attrs,ngmodelctrl) { function Validateequal (myvalue) {var valid = (MyValue = = scope. $eval (attrs.equals)) Ngmodelctrl. $setValidity (' equal ')
, valid); Return valid?
myvalue:undefined;
Ngmodelctrl. $parsers. push (Validateequal);
Ngmodelctrl. $formatters. push (Validateequal);
Scope. $watch (Attrs.equals,function () {Ngmodelctrl. $setViewValue (Ngmodelctrl. $viewValue);})}
}
}); <!--html--> <label for= "password" > Password </label> <input id= "password" name= "password" type= " Password "ng-model=" User.password "required> <label for=" Repassword "> Duplicate password </label> <input id=" Repassword "Name=" Repassword "type=" password "ng-model=" Repassword "<!--note that I'm going to use my custom directive-->equals="
User.password "required> <span style=" color:red "ng-show=" User.password!=repassword "> two times Password inconsistency </span> <input type= "Submit" class= "btn btn-primary btn-lg" value= "SAVE" ng-disabled= "Submit (UserfORM) "/> 

This way, coupled with the first method of judgment, you can perfectly verify the duplicate password.

The above is a small set to introduce the ANGULARJS to verify the method of duplicate password, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!