javascript - 验证 angularjs 中的密码指令

Question

谁能解释一下这段代码是如何工作的。

HTML 标记

<input type="password" ng-model="password" class="form-control" placeholder="Password" required>
<input type="password" ng-model="confirm_password" class="form-control" placeholder="Password" required validate-equals="password">

指令代码

angular.module('app')
  .directive('validate', function () {
    return {
      require: "ngModel",   
      link: function postLink(scope, element, attrs, ngModelCtrl) {
        function validate(value){
            var valid = (value === scope.$eval(attrs.validate));
            ngModelCtrl.$setValidtity('equal', valid);
            return valid ? value : undefined;
        }

        ngModelCtrl.$parsers.push(validate);
        ngModelCtrl.$formatters.push(validate);

        $scope.$watch(attrs.validate, function(){
            ngModelCtrl.$setViewValue(ngModelCtrl.$viewvalue);
        })
      }
    };
  });

任何人都可以向我解释以下问题。

以下代码在指令中执行什么操作？

$scope.watch(attrs.validate, function(){
    ngModelCtrl.$setViewValue(ngModelCtrl.$viewvalue);
});

值如何传递给validate()函数？

Answer 1

查看 ngModelController 的文档。由于该指令需要 ngModel，因此它接收 ngModelController 作为链接函数的第四个参数。关于您的其他问题:

1. $scope.watch(实际上应该是$scope.$watch)调用设置了 watch在指令运行的元素的 validate 属性上。如果 validate 属性由于某种原因发生变化(例如，它绑定(bind)到值发生变化的 AngularJS 表达式)，那么作为第二个参数传递的函数将被执行。该函数重置 View 值，从而重新触发注册为解析器的验证函数。
2. 根据 ngModelController 文档， View 值被传递到第一个解析器函数，并且该函数的结果被传递到下一个解析器，依此类推。同样，模型值将传递给第一个格式化程序函数，结果将传递给下一个格式化程序。