Angularjs 在父值更改后验证依赖值列表

使用角度1.5+

这是我的剧本。。。我有一个基本字段，称之为“基本”。 然后我得到了一个字段列表，需要是该基数的倍数，我使用$validator来实现这一点。。。一个简单的模数检查

我可以验证每个字段。。。因此，如果我突出显示列表中的一个字段并更改其值，它将正确激发和验证

我需要的是能够更改“基本”值并重新评估所有孩子。我已经研究了很多角度稍有不同的问题，这些问题都很相似，但在这个特殊的案例中，似乎没有一个对我有帮助

这样的观点：

<div ng-controller="myAppController as app" >
  <input type="text" ng-model="app.base" >
  <br><br>
  are these multiples of above?
  <br><br>
  <div ng-repeat="v in app.values">
    <input type="text" ng-model="v.value" multiple-of="{{app.base}}" />
 </div>

  var app = angular.module('myApp', []);
  app.controller('myAppController', function myAppController($filter) {
    var self = this;
    self.base = 10;
    self.values = [
      {value: 10},
      {value: 20},
      {value: 30},
      {value: 40},
      {value: 50}];
  });

对于值列表，使用如下验证程序：

  app.directive('multipleOf', function () {
      return {
          require: 'ngModel',
          link: function (scope, elm, attrs, ngModel) {
              ngModel.$validators.multipleOf = function (modelValue, viewValue) {
                  var value = parseInt(modelValue);
                  var base =  parseInt(attrs.multipleOf);
                  var valid = value >= base && value % base === 0;
                  return valid;
              };
          }
      };
  });

在这个特定的设置中，如果我将base更改为20，那么20和40的列表值应该是有效的，但是现在其他三个值应该是无效的。当基值更改时，如何触发此级联验证

---

Plunkr:

我已编辑了您的plunker，使其正常工作：

这不是我写的最好的代码，但它将解释基本原理，因为现在指令不能像预期的那样重用

app.directive('multipleOf', function() {
    return {
      require: 'ngModel',
      link: function(scope, elm, attrs, ngModel) {
        scope.myForm.base.$viewChangeListeners.push(function() {
          scope.myForm.value10.$validate();
          scope.myForm.value20.$validate();
          scope.myForm.value30.$validate();
          scope.myForm.value40.$validate();
          scope.myForm.value50.$validate();
        });
        ngModel.$validators.multipleOf = function(modelValue, viewValue) {
          if (scope.myForm.base.$modelValue && scope.myForm.base.$modelValue >= 0) {
            var value = modelValue || 0;
            var base = parseInt(scope.myForm.base.$modelValue);
            var valid = value >= base && value % base === 0;
            return valid;
          }
        };
      }
    };
  });

但是，如果您希望在更改一个字段后验证其他字段，则需要添加$viewChangeListeners。我希望它能解决你的问题。

找到了解决办法

首先，与其在视图中计算基表达式，不如将属性作为字符串传入

<div ng-controller="myAppController as app" >
  <input type="text" ng-model="app.base" >
  <br><br>
  are these multiples of above?
  <br><br>
  <div ng-repeat="v in app.values">
    <input type="text" ng-model="v.value" multiple-of="app.base" />
</div>

---

修改后的plunkr:

感谢您的回复。。。它让我朝着正确的方向发展，但我发现了一个更优雅的解决方案，我发布了这个解决方案。这种优雅值得商榷。你知道，输入inputfiels的$eval是一个很大的安全风险。您输入的所有内容都将被javascript代码执行。它不会对字段值本身执行$eval。。。它使用$eval获取属性的值。它基本上是说“给我app.base的值”…这是安全的。这使得指令更有用。但仍然发现这是一个短转弯，感觉不对劲。

  app.directive('multipleOf', function() {
    return {
      require: 'ngModel',
      link: function(scope, elm, attrs, ngModel) {
        ngModel.$validators.multipleOf = function(modelValue, viewValue) {
            var value = parseInt(modelValue);
            var base = parseInt(scope.$eval(attrs.multipleOf));
            var valid = value >= base && value % base === 0;
            return valid;
        };
        scope.$watch(attrs.multipleOf, function() {
          ngModel.$validate();
        })
      }
    };
  });