Question

我开始使用Angular的一些模型选项，例如ng-minlength =“3”和ng-required。这些工作正常，并在输入不正确时设置错误字段。

有没有办法让我可以使用这些选项来帮助我检查密码和确认密码是否相同，还是我需要为此添加一些javascript？我不确定它会有所作为，但这将是现代浏览器IE10及更高版本中的检查。

Answer 1

您可以创建自定义指令来验证输入：

var app = angular.module('sample', [])
    .directive('equalsTo', [function () {
    /*
     * <input type="password" ng-model="Password" />
     * <input type="password" ng-model="ConfirmPassword" equals-to="Password" />
     */
    return {
        restrict: 'A', // Use only as attribute
        scope: true,
        require: 'ngModel',
        link: function (scope, elem, attrs, control) {
            var check = function () {
                var v1 = scope.$eval(attrs.ngModel); // attrs.ngModel = "ConfirmPassword"                   
                var v2 = scope.$eval(attrs.equalsTo).$viewValue; // attrs.equalsTo = "Password"
                return v1 == v2;
            };
            scope.$watch(check, function (isValid) {
                control.$setValidity("equalsTo", isValid);
            });
        }
    };
}]);

这是一个示例

<input name="Password" required ng-minlength="6" />
<input name="ConfirmPassword" required equals-to="registerForm.Password" />

完整示例：http://jsfiddle.net/meziantou/bA6vm/light/

Answer 2

或者您可以重复使用this directive来匹配任何两个字段

Password: <input ng-model="user.password" type="password" />
Confirm: <input ng-model="user.passwordConfirm" type="password" data-match="user.password" />

有没有办法使用Angular我可以检查密码和确认密码是否相同？

2 个答案: