Angular ng-repeat - 动态创建集合 The ng-repeat directive in AngularJS is used to iterate over a collection and create a copy of a specified HTML element for each item in the collection. This allows you to dynamically create a collection of elements based on th
Angular ng-repeat - 动态创建集合 The ng-repeat directive in AngularJS is used to iterate over a collection and create a copy of a specified HTML element for each item in the collection. This allows you to dynamically create a collection of elements based on th
尝试动态创建集合并使用ng-repeat时,会出现问题:Angular进入循环并显示错误10 $digest() iterations reached. Aborting!
我通过这个例子简化了问题的最小化表达:\n
{{item}}
\n这是在Plunkr上的工作副本(页面显示正确结果,但在控制台中会显示上述错误。更复杂的例子完全失败)\n考虑到[1, 2, 3]可能是对象数组,这可能有所不同\n所以问题是为什么会这样,是否有简单的方法来解决这个问题?\n谢谢
Angular ng-repeat - 创建动态集合的问题
在使用ng-repeat时出现问题是因为您在ng-repeat中调用了reverse()函数。只要按照下面的方式调用,就可以正常工作且没有错误:
{{item}}
详细信息请参考stackoverflow.com/questions/19693410/…
正如我所说的,这只是一个简化的示例,而在ng-repeat中动态创建新集合是一个关键部分。在我的实际问题中,例如,它是一个接受集合并将其减少为新集合的函数。如果您有更好的示例供我们分析,那将更好。
问题的原因是在ng-repeat中调用了reverse函数,并且$apply和$digest多次。如果你使用的是AngularJS 1.3.x版本,并且你的数据只会在运行时创建一次且不会改变,你可以在任何ng-(指令)中输入以下内容来使用bind-once属性:
通过在a前面加上::告诉AngularJS这个数组或变量不会改变,这样它就会释放对它的$watch函数,并且不会消耗太多的$digest。
关于bind once特性的更多信息,请查看one-time-binding
对于反转技术本身,如果它是动态创建并经常改变的,你可以使用以下方法之一:
或者你也可以将它封装到过滤器中,如下所示:
app.filter('reverse', function() {
return function(items) {
return items.slice().reverse();
};
});
并在HTML中输入以下代码行:
对于一般的对象数组排序,你应该使用以下方法:
true表示倒序排序,false表示升序排序。
你还可以查看这个问题和答案获取更多信息: