初始化变量一次以防止“达到 10 个 $digest() 迭代”

Posted 2023-02-22

【中文标题】初始化变量一次以防止“达到 10 个 $digest() 迭代”

【英文标题】：Initialize variable once to prevent "10 $digest() iterations reached"

【发布时间】：2013-06-30 02:40:55

【问题描述】：

我正在对控制器中声明的函数返回的列表执行 ng-repeat，我得到“达到 10 个 $digest() 迭代。中止！”消息。

<div ng-repeat element in list()></div>

功能：

MyCtrl = ($scope)->
    ...
    $scope.list = ->
        list = 
        for e in someArray
            ....    #adding stuff to list
        list
    ...

我发现问题是 $scope.list() 函数被多次调用，每次调用该函数时，都会重新分配本地 list 变量，因此 angular 每次都会看到不同的对象，并且 ngRepeat 元素被重绘。我怎样才能避免这种情况？

【参考方案1】：

每个 $digest 至少计算两次 Angular 表达式，并且 $digest 一次可以运行 10 次（当绑定需要“刷新”时）。这意味着表达式将被重新评估多次。 这是 Angular 的常见缺陷之一。因此，您需要确保不要直接在表达式中调用函数。相反，让函数在控制器内部执行一次，然后在表达式中使用函数结果：

function MyCtrl($scope)

  function makeList()
    var list = [];
    // do some logic to generate a list
    return list;
  ;

  $scope.list = makeList();

<div ng-repeat="element in list"></div>

如果您必须直接调用作用域方法而不是确保方法是幂等的。

【讨论】：

谢谢，我明白了。

【参考方案2】：

我之前没有考虑过这个问题，但我在函数外部声明list 解决了这个问题，现在函数中返回的元素始终保持相同的引用。

MyCtrl = ($scope)->
    ...
    list = 
    $scope.list = ->
        for e in someArray
            ....    #adding stuff to list
        list
    ...

我仍然不喜欢我的解决方案，我想知道是否还有其他方法... 我还想知道该函数是否可以只调用一次或几次。在调试时，我看到该函数被多次调用，就像在范围发生变化时一样。如果someArray 很大或者函数内部的处理速度很慢，则重复调用似乎是一种开销。