在AngularJS中使用ng-disabled来验证元素集合时，会出现$rootScope:infdig错误

$rootScope:infdig error in AngularJS when using ng-disabled to validate a collection of elements

本文关键字：rootScope 错误 infdig 集合 AngularJS ng-disabled 元素 验证      更新时间：2023-09-26

我有一个问题与AngularJS应用程序，我已经创建了一个非常简化的版本在这里:http://plnkr.co/edit/55JlCxVV1SSKfcQgbICb?p=preview

我的问题是，当使用ng-disabled导致表单验证，并随后显示验证错误，并且，显然，启用/禁用保存按钮。

    <button ng-disabled="!validate()" ng-click="save()">Save</button>
    $scope.validate = function() {
      var valid = true;
      if (!$scope.foo || $scope.foo.length < 5) {
        valid = false;
        messageService.addMessage('ERROR', 'foo', 'foo must be at least 5 characters', 0);
      } else {
        messageService.deleteMessage('ERROR', 'foo');
      }
      if (!$scope.bar || $scope.bar < 10) {
        valid = false;
        messageService.addMessage('ERROR', 'bar', 'bar must be at least 10', 0);
      } else {
        messageService.deleteMessage('ERROR', 'bar');
      }
      if (!$scope.wotsit || $scope.wotsit.length > 15) {
        valid = false;
        messageService.addMessage('ERROR', 'wotsit', 'wotsit must be less than 15 characters', 0);
      } else {
        messageService.deleteMessage('ERROR', 'wotsit');
      }
      return valid;
    };

我还有另一个小问题(可能在这个问题的范围之外，但我还是会问它!)-在thingController.save() -你会看到我清除所有当前可见的消息(捕获所有-如果这个特定的形式已经验证，将没有消息-但在真正的应用程序中它是有意义的)，然后添加一个确认保存动作，但这似乎被添加到消息对象，然后立即删除?令人困惑，但很可能是我的错误——如果有人能给我指出正确的方向，那就太棒了。

$scope.save = function() {
    if ($scope.validate()) {
        messageService.clearAllMessages();
        messageService.addMessage('SUCCESS', 'save', 'Saved some stuff, promise', 0);
    }
};

作为题外话，我意识到我目前应用的所有验证都可以使用开箱即用的AngularJS验证指令来实现，但实际应用中的验证却不能，所以解决方案需要继续使用这种验证方法。

提前感谢:)

你的问题是:

$scope.$watch('messages', function() {
    console.log(messageService);
    $scope.messages = messageService.messages;
}, true);

如果你点击AngularJS中的错误链接，它会用一个非常相似的例子来解释问题所在。其主要思想是监视$scope。消息和内部正在更改$scope。消息值将再次触发$watch…等等......无数次。为了防止这种情况，Angular内置了一个fail系统来停止无限循环。

相关文章：