一尘不染

如何循环通过ng-repeat函数返回的项目?

angularjs

我想重复创建div,这些项目是函数返回的对象。但是,以下代码报告错误:达到10个$
digest()迭代。流产!jsfiddle在这里:http//jsfiddle.net/BraveOstrich/awnqm/

<body ng-app>
  <div ng-repeat="entity in getEntities()">
    Hello {{entity.id}}!
  </div>
</body>

阅读 253

收藏
2020-07-04

共1个答案

一尘不染

简短的回答
:您真的需要这样的功能还是可以使用属性?http://jsfiddle.net/awnqm/1/

长答案

为简单起见,我仅描述您的情况-ngRepeat对象数组。另外,我将省略一些细节。

AngularJS使用脏检查来检测更改。当应用程序启动时运行$digest$rootScope$digest将对作用域的层次结构进行深度优先遍历。所有范围都有手表清单。每个手表都有最后一个值(最初是initWatchVal)。对于所有手表的每个作用域,$digest它都会运行,获取当前值(watch.get(scope))并将其与进行比较watch.last。如果当前值不等于watch.last(始终用于第一次比较),则$digest设置dirtytrue。如果处理所有范围,dirty == true $digest则从开始另一个深度优先遍历$rootScope$digest当脏== false或遍历次数==
10时结束。在后一种情况下,错误“达到10 $ digest()迭代”。将被记录。

现在大约ngRepeat。对于每次watch.get调用,它将来自集合(返回值getEntities)的对象与其他信息一起存储在缓存中(HashQueueMaphashKey)。对于每个watch.get调用,ngRepeat尝试通过其hashKey缓存获取对象。如果它在缓存中不存在,则将其ngRepeat存储在缓存中,创建新的作用域,在其上放置对象,创建DOM元素,等等

现在大约hashKey。通常hashKey是由生成的唯一编号nextUid()。但这可以起作用hashKey生成后存储在对象中以供将来使用。

为什么您的示例会产生错误
:函数getEntities()总是返回带有新对象的数组。该对象hashKeyngRepeat缓存中不存在也不存在。因此ngRepeat,每个watch.get手表都会为for生成新的作用域{{entity.id}}。这只手表先watch.getwatch.last== initWatchVal。这样watch.get()!=watch.last。因此$digest开始新的遍历。因此ngRepeat用新的手表创造了新的范围。所以… 10个遍历后,您会得到错误。

如何解决

  1. 不要在每次getEntities()调用时都创建新对象。
  2. 如果需要创建新对象,则可以hashKey为其添加方法。有关示例,请参见本主题

希望知道AngularJS内部知识的人会在我做错事情时纠正我。

2020-07-04