Question

我正在尝试执行＆＃34;确认密码＆＃34;以角度形式

<input
     type="password" name="password"
     ng-model="regFormData.password" ng-change="dupCheck(regForm.password,regForm.repassword)" required=""/>
<input
     type="password" name="repassword"
     ng-model="regFormData.repassword" ng-change="dupCheck(regForm.password,regForm.repassword)"/>

问题是dupCheck()看起来像这样

  $scope.dupCheck = function(p1, p2) {
    p2.$setValidity("mismatch",  (p1.$viewValue === p2.$viewValue));
  };

第一次调用$setValidity()是第一次更改密码或repassword，这意味着两个字段不同，因此第二个参数false。最后，当然，它设置为true，但为时已晚，并且修复词已被破坏：它不会将其值复制到其模型中。

两个问题：

这里有什么问题？这是一个已知的错误？我误用了$setValidity()吗？
整个设置似乎相当复杂。是否有更简单的方法来强制执行这样的平等？

Answer 1

请找我上周实施的解决方案：

app.directive('sameAs', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        scope: { other: '=sameAs' },
        link: function (scope, el, attrs, ctrl) {
            ctrl.$validators.sameAs = function(modelValue, viewValue) {
                return viewValue === scope.other;
            };
            scope.$watch('other', function(newValue, oldValue) {
                ctrl.$validate();
            });
        }
    };
});

使用，请把它放在第二个输入上：

<input type="password" ng-model="pass"/>
<input type="password" ng-model="pass2" same-as="pass"/>

观察手表。这是必要的，因为用户可以先填充第二个字段，然后在第一个字段上确认（或更正）。如果没有此选项，第二个字段可能会保持无效。

尝试确认密码时$ setValidity（）打破ng-model

1 个答案: