Ng-repeat with ng-hide或在控制器中执行该工作以提高性能

Ng-repeat with ng-hide OR do the job in the controller for improved performance?

本文关键字：工作 高性能 执行 ng-hide with 控制器 Ng-repeat      更新时间：2023-09-26

这个问题很简单，但我确信它为应用程序开发提供了附加价值。

在性能方面，使用

是否更好?
ng-repeat="r in roads", ng-hide="r.distance > 1000"

或者在控制器中推送数组中的项更好，像这样:

for (var i in $scope.roads) {
    var road = $scope.roads[i];  
    if (road.distance <= 1000) $scope.roadsToShow.push(road);
}

然后使用，就像这样重复?

ng-repeat="r in roadsToShow"

就更好的性能而言，哪个被认为是最佳实践?假设数组中的对象超过1000个

过滤数组会明显更好，原因如下:

最重要的是ng-hide需要创建一个内部手表，手表是昂贵的，可能会导致性能瓶颈

其次，将有更少的dom节点来渲染

也有很多方法可以在angular中进行过滤。

不要在ng-repeat中使用ng-hide、ng-show、ng-if等作为过滤工具

最好在控制器或服务器上过滤数组项，而不是在呈现后隐藏它们。如果在显示数组之前对其进行过滤，浏览器就不需要呈现与该项关联的DOM，然后再花时间隐藏它。请记住，使用ng-hide将CSS类display: none应用于元素，因此节点存在但不可见。

相关文章：