angularjs 密码一致性校验

港控/mmm° 2022-07-17 00:21 192阅读 0赞

**angularjs 校验密码字段一致性**

Js代码   ![收藏代码][icon_star.png]

1.  directives.directive('pwCheck', **function** () \{  
2.      **return** \{  
3.          require: 'ngModel',  
4.          link: **function** (scope, elem, attrs, ctrl) \{  
5.              **var** firstPassword = '\#' + attrs.pwCheck;  
6.              // 网上好多例子都掉了$(elem) 美元符号和括号  
7.              $(elem).add(firstPassword).on('keyup', **function** () \{  
8.                  scope.$apply(**function** () \{  
9.                      alert(elem.val());  
10.                     **var** v = elem.val()===$(firstPassword).val();  
11.                     ctrl.$setValidity('pwmatch',v);  
12.                 \});  
13.             \});  
14.         \}  
15.     \};  
16. \});

Html代码   ![收藏代码][icon_star.png]

1.  **<****div** class="form-group" ng-class="\{'has-error': developerForm.password.$dirty && developerForm.password.$invalid\}"**>**  
2.                     **<****div** class="col-sm-12"**>**  
3.                         **<****input** type="password" ng-model="developer.password" name="password" id="password" class="form-control" placeholder="预设密码" required**>**  
4.                     **</****div****>**  
5.                     **<****p** class="text-warning help-block" ng-show="developerForm.password.$dirty && developerForm.password.$invalid"**>**  
6.                         **<****small** ng-show="developerForm.password.$error.required"**>**预设密码必填!!**</****small****>**  
7.                     **</****p****>**  
8.                 **</****div****>**  
9.                 **<****div** class="form-group" ng-class="\{'has-error': developerForm.rePassword.$dirty && developerForm.rePassword.$invalid\}"**>**  
10.                    **<****div** class="col-sm-12 "**>**  
11.                        **<****input** type="password" ng-model="developer.rePassword" name="rePassword" class="form-control" placeholder="确认密码" pw-check="password" required**>**  
12.                    **</****div****>**  
13.                    **<****p** class="text-warning help-block" ng-show="developerForm.rePassword.$dirty && developerForm.rePassword.$invalid"**>**  
14.                        **<****small** ng-show="developerForm.rePassword.$error.required"**>**确认密码必填!!**</****small****>**  
15.                        **<****small** ng-show="developerForm.rePassword.$error.pwmatch"**>**预设密码和确认密码不一致!!**</****small****>**  
16.                    **</****p****>**  
17.                **</****div****>**

源引：http://tramp-zzy.iteye.com/blog/2179274

[icon_star.png]: /images/20220717/94c60c63bcd84689aa31add9ff07ea94.png