angularjs 密码一致性校验_angularjs 密码确认校验-CSDN博客

angularjs 校验密码字段一致性

    Js代码   
    
  
 directives.directive('pwCheck', function () {  
     return {  
         require: 'ngModel',  
         link: function (scope, elem, attrs, ctrl) {  
             var firstPassword = '#' + attrs.pwCheck;  
             // 网上好多例子都掉了$(elem) 美元符号和括号  
             $(elem).add(firstPassword).on('keyup', function () {  
                 scope.$apply(function () {  
                     alert(elem.val());  
                     var v = elem.val()===$(firstPassword).val();  
                     ctrl.$setValidity('pwmatch',v);  
                 });  
             });  
         }  
     };  
 });  

    Html代码   
    
  
 <div class="form-group" ng-class="{'has-error': developerForm.password.$dirty && developerForm.password.$invalid}">  
                    <div class="col-sm-12">  
                        <input type="password" ng-model="developer.password" name="password" id="password" class="form-control" placeholder="预设密码" required>  
                    </div>  
                    <p class="text-warning help-block" ng-show="developerForm.password.$dirty && developerForm.password.$invalid">  
                        <small ng-show="developerForm.password.$error.required">预设密码必填!!</small>  
                    </p>  
                </div>  
                <div class="form-group" ng-class="{'has-error': developerForm.rePassword.$dirty && developerForm.rePassword.$invalid}">  
                    <div class="col-sm-12 ">  
                        <input type="password" ng-model="developer.rePassword" name="rePassword" class="form-control" placeholder="确认密码" pw-check="password" required>  
                    </div>  
                    <p class="text-warning help-block" ng-show="developerForm.rePassword.$dirty && developerForm.rePassword.$invalid">  
                        <small ng-show="developerForm.rePassword.$error.required">确认密码必填!!</small>  
                        <small ng-show="developerForm.rePassword.$error.pwmatch">预设密码和确认密码不一致!!</small>  
                    </p>  
                </div>  