1

我在使用 ng-repeat 时遇到了一些性能问题，并且 1000+<tr>一些谷歌搜索告诉我，我必须推出自己的指令来克服 $digest 循环。我不明白我该怎么办？有人可以解释一下，我该如何提高性能。我必须显示所有 1000 多行这是要求，现在创建整个表需要将近 20 秒。

非常感谢。

<tr ng-repeat="obj in objs" id="obj{{obj.id}}" ng-show="displayObj(obj)">
    <td>{{obj.objId}}</td>
    <td style="min-width: 70px;">
        <textarea rows="3" style="width: 100px" name="text" maxlength="100" ng-model="obj.text"></textarea>
    </td>
    <td><button class="btn btn-primary" ng-click="saveObj($event, obj)">Update</button></td>
</tr>

在控制器中

$scope.saveObj = function ($event, obj) {
                console.log(deal);
                var UpdateObj = ObjService.updateObj();
                var updateObj = new UpdateObj();

                updateObj.text = obj.text;
                updateObj.$update({objId: obj.id});
            };

现在我意识到性能问题来自 $apply 我有大约 3000 个元素。如果我关闭 ng-model，性能会更好。但我会失去双向数据绑定。无论如何我可以在这里调整性能吗？

4

2 回答 2

0

如果有人现在偶然发现这个问题，我通常会推荐无限滚动。它使@toy 提到的过滤操作非常简单。当它们包含用于删除您滚动过去的屏幕外元素的选项时，它将成为杀手级 ng-repeat 性能选项。

于 2014-03-29T03:41:01.357 回答
0

现在遇到这个问题的任何人都应该使用像 bind-once 这样的东西。

大多数数据一旦加载就不会改变，因此可以变得不可变，bindonce 将观察者从绑定中移除以提高性能。

它非常易于使用并且有很好的文档。

https://github.com/Pasvaz/bindence

此外，您不应该一次加载 1000 行，您可以通过实现服务器端分页来按需加载数据来避免这种情况。

这篇文章解释。AngularJS 中的服务器端分页

于 2016-07-20T11:19:35.983 回答