Question

我试图创建一个显示给定数据的指令。显示数据涉及一个简单的解析，我将其放入指令的控制器函数中。运行此操作时，我收到了臭名昭着的10 $digest() iteration reached错误，但无法理解原因。

我已将所有内容分离到这个非常简单的plnkr中： http://plnkr.co/edit/D8X9AmfDPdbvQDr4ENBR?p=preview

有人可以说：

当我使用ng-repeat迭代getList（）函数结果时，为什么它只会失败？但是当我打印它时它不会失败？
为什么我从getList（）返回一个数组时才会失败，但是当我返回一个Object时却没有？
为什么只有从getList（）返回列表时它才会失败，但是同一个列表，只是控制器中的静态列表有效？

我必须说我在这里感到困惑......

Answer 1

每次执行return [...];都会创建一个 new 数组。然后ng-repeat认为观察到的表达式已经改变并触发另一个摘要周期......再次调用getList()，返回一个新数组，触发等等。

我认为在track by表达式中使用ng-repeat会有所帮助，但事实并非如此。似乎track by可以将对象的更新版本与数组相关联，但不会更改数组本身。

唯一的方法是确保每次都返回相同的数组引用。 E.g：

controller: function($scope) {
    var list = [];

    $scope.getList = function() {
        return list;
    };

    $scope.fetchList = function() {
        // You would need a way to fill the list. Can of course be done in
        // the initializer, i.e. `var list = [{x:1, y:2}]`, but this is a trivial
        // case; you probably want to call a service and fill the list.
        ...
    };

    $scope.removeFromList = function(item) {
        // also remember *not* to change the reference when manipulating the list,
        // e.g. removing items: do it in place with `splice()`, `push()` etc
        var index = list.indexOf(item);
        if( index >= 0 ) {
            list.splice(index, 1);
        }
    };
}

无论如何，使用track by都有自己的优点，所以请考虑一下，但这与此问题无关。

＆＃34; 10 $ digest（）迭代达到＆＃34;当ng-从指令的控制器功能重复一个列表时

1 个答案: