2015-04-21 170 views
1

我有一个重复的元素,重复列表中的项目“mylist”。 如果mylist超过特定大小,javascript中是否有方法“禁用”该元素上的ng-repeat?或者,如果我点击一个按钮,手段列表的ng重复行为将被禁用或指向一个不同的列表,以便我不会得到性能问题,如果用户将50,000项目添加到列表中?有没有办法通过单击按钮禁用ng-repeat?

+0

我发现,对于导致ng-repeat问题的大型列表,最好创建自己的指令来为您建立表格。 50,000元素会使您的网站因ng-repeat而屈膝,因为它必须检查每个摘要中的每个项目。 – Scottie

+0

“禁用”是什么意思?你不想渲染'ng-repeat'元素并渲染其他东西吗?或者你只想渲染前N个元素? –

回答

0

您可以手动更改您在任何时候都在重复的内容(例如减少mylist如果T变得太大),或者你可以简单地使用limitTo限制的项目数重复:

<div ng-repeat="item in mylist | limitTo: myLimit"> 

而且在你的控制器:

$scope.myLimit = 50; 

然后,您可以添加一个按钮“加载更多”,只会做$scope.myLimit += 50例如(或做的是,当用户向下滚动列表,通常称为“有限滚动“)。

+0

这对性能有帮助,因此50,000个项目不会被“监视”/命中性能问题。 – Rolando

+0

是的,那只会在DOM中创建50个项目,只有他们会拥有观察者。表演会更好! – floribon

+0

想限制为10.除此之外,没有。 – Rolando

0

您可以使用limitTo过滤器来限制ng-repeat显示的条目。你可以在这里找到更多关于它的信息:https://docs.angularjs.org/api/ng/directive/ngRepeat

尽管没有迹象表明限制已达到,并且并非所有元素都显示出来。你需要自己实现。 limitTo过滤器仅限于第一个元素,您无法获取数组的视图子部分。

另一种选择是使用虚拟滚动指令。喜欢的东西:https://github.com/EnzeyNet/VirtualScroll

+0

这是否有助于提高性能,以至于50,000个项目不会被“监视”/命中性能问题。 – Rolando

+0

正确,虚拟缓冲背后的想法是只监视屏幕上可见的行。滚动条使您看起来像拥有列表中的所有项目,而实际上只有当前在视图中修复的项目才被渲染和观看。一旦这些行滚动出视图,手表将被移除。 – Enzey

相关问题