angular.js包装时NG-重复

以下这个答案的基本思路上SO Angular.js ng-repeat: opening/closing elements after x iterations angular.js包装时NG-重复

我分组项目，在一个div包裹它们后，并收到以下错误Error: 10 $digest() iterations reached. Aborting! Watchers fired in the last 5 iterations:

试图多次迭代

这使我相信Angular期待重复10次，并且只注册5.但是，输出看起来正确，所有10个项目都显示出来。

我正在构建一个windows开始屏幕类型的布局，其中一些图块将是单个，其他双倍宽度。我正在做一些计算来将div包装在div中。

我已经建立了该过滤器是

 
app.filter('partition', function() { 
    var part = function(arr, size) { 
    if (0 === arr.length) return []; 
    var applist=[]; 
    var partlist=[]; 
    var blocksize=0; 
    console.log(arr); 
    for(var a in arr){ 
     var app = arr[a]; 

     if(app.width=='single'){ 
      console.log(app.name); 
      partlist.push(app); 
      blocksize++; 
     } 
     if(app.width=='double' && blocksize=4){ 
      applist.push(partlist); 
      partlist=[app]; 
      blocksize=2; 
     } 

     if(blocksize==size || a==arr.length-1){ 
       applist.push(partlist); 
       partlist=[]; 
       blocksize=0; 
      } 
    } 
    console.log(applist) 
    return applist; 
    }; 
    return part; 
});

，并

 
<div ng-repeat="block in apps | filter:search | partition:6" class="app-block" > 
    <li ng-repeat="app in block" class="app-tile" ng-class="{double:app.width=='double'}"> 
      <div class="name">{{app.name}}</div> 
    </li> 
</div>

我使用嵌套的重复错误的NG-重复的HTML？正如我所说，正在显示的瓷砖数量是正确的，但错误是关于我的事情（这是大的，丑陋的和红色的）。

来源

2013-08-21 pedalpete

这里的根本问题是你的partition过滤器返回一个数组数组;每个摘要周期，它返回一个不同的数组数组，即使内部的内部数组都是相同的。

例如，在你的JavaScript控制台检查这个表达式：

[[1, 2], [3, 4]] == [[1, 2], [3, 4]] // false

因为ngRepeat认为每一次的阵列是不同的，它继续重新运行消化周期，直到达到最大的10.

如果您有一个Plunker或JSFiddle，它可以提供您问题的更完整的工作画面，这将有助于演示解决方案;代替这一点，请查看this answer以及该问题的接受答案。

一两件事你可以做的是操纵数据在控制器和迭代，与其：

app.controller('SomeController', function($scope, $filter) { 
    $scope.apps = [ ... ]; 

    var calculateBlocks = function() { 
    var filteredBlocks = $filter('filter')($scope.search); 
    $scope.appsBlocks = $filter('partition')(filteredBlocks, 6); 
    }; 

    // Every time $scope.apps changes, set $scope.appsBlocks 
    // to the filtered and partitioned version of that data. 
    // In AngularJS 1.4+ you can use $watchCollection: 
    // http://code.angularjs.org/1.1.4/docs/api/ng.$rootScope.Scope#$watchCollection 
    $scope.$watch('apps', calculateBlocks, true); 
    // Same if the search term changes. 
    $scope.$watch('search', calculateBlocks); 
});

然后在你的HTML：

<div ng-repeat="block in appsBlocks" class="app-block" > 
    <li ng-repeat="app in block" class="app-tile" ng-class="{double:app.width=='double'}"> 
    <div class="name">{{app.name}}</div> 
    </li> 
</div>

来源

2013-08-21 06:36:50

angular.js包装时NG-重复

回答

相关问题