Angular：$scope.$watch($attr.ngModel) 仅在验证器在指令中返回 true 时工作

Question

使用最新版本的 Angular。

当我设置自定义验证器并监视 ngModel 的更改时，我有一个指令。 $scope.$watch 仅在验证器返回 true 时有效，而在返回 false 时无效。我很好奇为什么会这样以及替代方案是什么。

目标是验证器应该在满足正确条件时将表单设置为有效。 $scope.watch() 旨在在用户输入时进行额外的文本格式化，例如，仅允许输入数字。

app.directive('validatorDirective', [
  function ($timeout) {
    return {
      restrict: 'A',
      require: 'ngModel',
      link: function ($scope, $element, $attr, $controller) {

        $scope.$watch($attr.ngModel, function (val) {
          // no output when validator returns false, but returns model updates when validator returns true
          console.log(val);
        });

        $controller.$validators.validFn = function (modelValue, viewValue) {
          return false;
        };
      }
    }
  }
}]);

Answer 1

当验证失败时，Angular ng-model 的值是 null。我的假设是这会导致您的问题。

在 Angular 1.3 中，他们添加了 ng-model-options 以允许在模型上设置无效值：

<input ng-model="my.value" ng-model-options="{allowInvalid: true}">

我认为可能发生的情况是，一旦模型变得无效，值就永远不会改变。即使您可以继续输入输入，模型值仍然为 null，并且观察者不会触发。