Angular v1.4重复div而无需重新渲染已渲染的项目

我编写了代码来重复图像数组和加载更多按钮到ajax请求并在该数组中推送响应图像。但是每当新的回应出现时，整个图像就会重新洗牌。Angular v1.4重复div而无需重新渲染已渲染的项目

<div class="container"> 
    <div ng-repeat="image in images track by $index"> 
     <div class="panel panel-default"> 
      <div> 
      <img ng-src="{{image.Src}}" alt="" height="200" width="200"> 
      </div> 
     </div> 
    </div> 
</div>

在我的控制器代码：

$scope.loadMore = function() { 
    pageNumber ++; 
    homeService.getListData(pageNumber) 
          .then(function (data) { 
           for (var i = 0; i < data.length; i++) { 
            $scope.images.push(data[i]); 
           }; 
         }); 
        }; 
       };

每次服务器发送三个图像。以前我没有使用track by $index，然后从from this SO answar我加了track by $index但没有运气。我想角是重新渲染整个数组。如果是这样，我该如何停止这个重新渲染？

来源

2017-01-09 Moshii

您可以使用Array.concat（）而不是推送所有元素，这可能会解决您的问题。

$scope.loadMore = function() { 
     pageNumber ++; 
     homeService.getListData(pageNumber) 
       .then(function (data) { 
        $scope.images = $scope.images.concat(data); 
       }); 
    };

来源

2017-01-09 20:31:48

很难说为什么角度重新排序你的图像，因为它看起来不像你的数组正在重新排序。

尝试添加orderBy子句。像这样的东西应该工作：

<div ng-repeat="image in images | orderBy : image.$index track by $index">

并保持一切都是一样的。这将确保图像的顺序保持一致。

来源

2017-01-09 22:18:37

Angular v1.4重复div而无需重新渲染已渲染的项目

回答

相关问题