我这里有这个脚本：
angular.module('UserValidation', []).directive('validPasswordC', function () {
return {
require: 'ngModel',
link: function (scope, elm, attrs, ctrl) {
ctrl.$parsers.unshift(function (viewValue, $scope) {
var noMatch = viewValue != scope.signupForm.password.$viewValue
ctrl.$setValidity('noMatch', !noMatch)
})
}
}
});
这是 HTML：
<div class="fieldset" ng-class="{'has-error':formData.password.$invalid && !formData.password.$pristine}">
<label>Password</label>
<input type="password" id="password" name="password" ng-model="formData.password" ng-minlength="8" ng-maxlength="20" ng-pattern="/(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z])/" placeholder="password" required />
<p ng-show="signupForm.password.$error.required" class="error">*</p>
<p ng-show="signupForm.password.$error.minlength" class="error">
Passwords must be between 8 and 20 characters.</p>
<p ng-show="signupForm.password.$error.pattern" class="error">
Must contain one lower & uppercase letter, and one non-alpha character (a number or a symbol.)</p>
</div>
<div class="fieldset" ng-class="{'has-error':formData.password_c.$invalid && !formData.password_c.$pristine}">
<label for="password_c">Confirm Password</label>
<input type="password" id="password_c" name="password_c" ng-model="formData.password_c" placeholder="confirm password" valid-password-c required />
<p ng-show="signupForm.password_c.$error.noMatch" class="error">Passwords do not match.</span>
<p ng-show="signupForm.password_c.$error.required" class="error">*</p>
</div>
密码的字符验证有效，但确认密码的“noMatch”功能不起作用。
可能是什么问题？谢谢！ :)
您还需要将原始密码传递给指令/
请参阅下面的工作演示
var app = angular.module('app', []);
app.directive('validPasswordC', function() {
return {
require: 'ngModel',
scope: {
reference: '=validPasswordC'
},
link: function(scope, elm, attrs, ctrl) {
ctrl.$parsers.unshift(function(viewValue, $scope) {
var noMatch = viewValue != scope.reference
ctrl.$setValidity('noMatch', !noMatch);
return (noMatch)?noMatch:!noMatch;
});
scope.$watch("reference", function(value) {;
ctrl.$setValidity('noMatch', value === ctrl.$viewValue);
});
}
}
});
app.controller('homeCtrl', function($scope) {
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
<div ng-controller="homeCtrl">
<p>Password:{{formData.password}}</p>
<form name="signupForm">
<div class="fieldset" ng-class="{'has-error':formData.password.$invalid && !formData.password.$pristine}">
<label>Password</label>
<input type="password" id="password" name="password" ng-model="formData.password" ng-minlength="8" ng-maxlength="20" ng-pattern="/(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z])/" placeholder="password" required />
<p ng-show="signupForm.password.$error.required" class="error">*</p>
<p ng-show="signupForm.password.$error.minlength" class="error">
Passwords must be between 8 and 20 characters.</p>
<p ng-show="signupForm.password.$error.pattern" class="error">
Must contain one lower & uppercase letter, and one non-alpha character (a number or a symbol.)</p>
</div>
<div class="fieldset" ng-class="{'has-error':formData.password_c.$invalid && !formData.password_c.$pristine}">
<label for="password_c">Confirm Password</label>
<input type="password" id="password_c" name="password_c" ng-model="formData.password_c" placeholder="confirm password" valid-password-c="formData.password" required />
<p ng-show="signupForm.password_c.$error.noMatch" class="error">Passwords do not match.</span>
<p ng-show="signupForm.password_c.$error.required" class="error">*</p>
</div>
</form>
</div>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
