利用AngularJS的directive,我们可以很方便的实现检验功能。代码如下:
// 密码验证directive
ftitAppModule.directive('pwCheck', [function () {
? ? return {
? ? ? ? require: 'ngModel',
? ? ? ? link: function (scope, elem, attrs, ctrl) {
? ? ? ? ? ? var firstPassword = '#' + attrs.pwCheck;
? ? ? ? ? ? elem.add(firstPassword).on('keyup', function () {
? ? ? ? ? ? ? ? scope.$apply(function () {
? ? ? ? ? ? ? ? ? ? var v = elem.val()===$(firstPassword).val();
? ? ? ? ? ? ? ? ? ? ctrl.$setValidity('pwmatch', v);
? ? ? ? ? ? ? ? });
? ? ? ? ? ? });
? ? ? ? }
? ? }
}]);
? ?
? ? ? ? ? ? ? placeholder="请输入密码" ng-model="selectedUser.userPassword">
? ? ng-class="{'has-success' : !usrMgrForm.confirmPassword.$pristine && usrMgrForm.confirmPassword.$valid,
? ? ? ? ? ? ? ? 'has-error' : !usrMgrForm.confirmPassword.$pristine && usrMgrForm.confirmPassword.$invalid }">
? ?
? ? ? ? ? ? ? placeholder="请再次输入密码" ng-model="selectedUser.confirmPassword" pw-check="userPassword">
? ?
? ? ? ?
? ?
? ?
? ? ? ?
? ?
效果如下:

?
希望你喜欢,并分享我的工作~带你走近AngularJS系列: