有两个ng-model指令会导致:达到$ $ digest()迭代。中止

时间:2014-02-13 03:23:22

标签: dart angular-dart

这是一个真正被剥离的版本,似乎导致Angular-Dart从无限循环中止。我查看了stackoverflow上的其他每个相关问题,但我无法取得任何进展。这似乎是一个特别微不足道的实现,应该有用......我想念的是什么?

我有两个组件(comp_a和comp_b):

A:

library comp_a;

import 'package:angular/angular.dart';

@NgComponent(
    selector: 'comp-a',
    template: '<div id="compa"></div>',
    publishAs: 'cmp'
)
class CompA {
  NgModel _ngModel;

  CompA(this._ngModel);
}

B:

library comp_b;

import 'package:angular/angular.dart';

@NgComponent(
    selector: 'comp-b',
    template: '<div id="compb"></div>',
    publishAs: 'cmp'
)
class CompB {
  NgModel _ngModel;

  CompB(this._ngModel);
}

我的main() dart文件同样无聊:

library main;

import 'package:angular/angular.dart';
import 'package:loop/component/comp_a.dart';
import 'package:loop/component/comp_b.dart';

class CompModule extends Module {

  CompModule() {
    type(CompA);
    type(CompB);
  }
}

void main() {
  ngBootstrap(module: new CompModule());
}

与我的html文件一样:

<!DOCTYPE html>

<html ng-app>
  <body>

      <comp-a ng-model="[1]"></comp-a>
      <comp-b ng-model="[2]"></comp-b>

    <script type="application/dart" src="loop.dart"></script>
    <script src="packages/browser/dart.js"></script>
  </body>
</html>

如果我同时<comp-a>...<comp-b>...没有ng-model,那么事情就会很好(即控制台中没有错误)。如果我有<comp-a>...<comp-b>...ng-model,那么事情就可以了......只有当他们两个都有ng-model我才能得到这个:

5 $digest() iterations reached. Aborting!
Watchers fired in the last 3 iterations: [["ng-model=[1]","ng-model=[2]"],["ng-model=[1]","ng-model=[2]"],["ng-model=[1]","ng-model=[2]"]]

STACKTRACE:
#0      Scope._digestWhileDirtyLoop (package:angular/core/scope.dart:526:5)
#1      Scope.$digest (package:angular/core/scope.dart:475:28)
#2      _autoDigestOnTurnDone (package:angular/core/scope.dart:153:14)
#3      _rootRun (dart:async/zone.dart:688)
#4      _ZoneDelegate.run (dart:async/zone.dart:417)
#5      NgZone._finishTurn (package:angular/core/zone.dart:91:21)
#6      NgZone._onRunBase (package:angular/core/zone.dart:56:43)
#7      _onRun (package:angular/core/zone.dart:61:15)
#8      _ZoneDelegate.run (dart:async/zone.dart:417)
#9      _CustomizedZone.run (dart:async/zone.dart:627)
#10     NgZone.run (package:angular/core/zone.dart:143:27)
#11     ngBootstrap (package:angular/bootstrap.dart:87:18)
#12     main (http://127.0.0.1:3030/loop/web/loop.dart:16:14)

谢谢!

2 个答案:

答案 0 :(得分:0)

疯狂猜测

[1] [2]映射到相同的Scope属性(可能是错误)并反复更新其他值。 (1,2,1,2,1,2,......)

我会尝试用div标记括起每个元素,并为它们添加一些虚拟控制器以隔离范围。

我这里没有深刻的知识。可能有更好的解决方案。

答案 1 :(得分:0)

MiškoHevery在这里回答了这个问题: https://groups.google.com/d/msg/angular-dart/MYhHBphdY8Q/0ZU8nXQu9ZEJ

  

您的范围理解是正确的。但是由于观察者的工作方式(很快就会被修复),系统会为每个摘要创建一个新的数组。这就是它永远不会稳定的原因。你应该绑定到一个字段。 ng-model =“someCtroller.someField”而不是ng-mode =“[1]”。    - misko

我用控制器的指令将我的两个组件包装在div中,并将静态数组中的ng-models更改为绑定到相应的控制器字段,一切正常。

如,

@NgController(
  selector: '[test-controller]',
  publishAs: 'ctrl'
)
class TestController {

  List a;
  List b;

}

而且,

<div test-controller>
    <comp-a ng-model="ctrl.a"></comp-a>
    <comp-b ng-model="ctrl.b"></comp-b>
</div>

解决了这个问题。静态数组仅用于测试目的,所以我没有通过引入控制器而丢失任何东西。