为什么我在这里得到一个无限的摘要错误？答案

【问题标题】：Why do I get an infinite digest error here?为什么我在这里得到一个无限的摘要错误？
【发布时间】：2016-02-19 21:24:24
【问题描述】：

我需要创建以平面数组形式出现的事物组，因此我可以使用 CSS 网格系统打开和关闭网格行。

这是我的 HTML 的外观：

<div ng-repeat="row in items | GroupsOf: 3" class="row">
    [show stuff]
</div>

这是我为支持这一点而编写的过滤器：

.filter('GroupsOf', function(){     
    //Takes an array of things and groups them into  
    // sub-arrays with numPerGroup things in each 
    return function(things, numPerGroup){

        var i, group = -1, groups = []          
        for(i = 0; i < things.length; i++){
            //if it's a new group:
            if(i % numPerGroup === 0){                  
                groups.push([])
                group++
            }
            groups[group].push(things[i])
        }
        return groups//
    }
})

虽然事情按预期呈现，但运行时我收到了无限的摘要错误，因此并非所有内容都正确连接。 为什么会出现该错误，如何修复过滤器以使其正常工作？

我真的更喜欢将其作为过滤器而不是在控制器中对数据进行分组，但如果有人可以向我解释为什么它不能作为过滤器实现，我会走后面的路线。

【问题讨论】：

[show stuff] 是不是只显示值而不做任何额外的处理？
你应该发布你的回溯
@LuisMasuelli：即使节目内容中没有nothing，我也会收到错误消息。
如果数据是异步加载的，请确保在循环之前返回，否则things将未定义
这种分块在服务或控制器中会好得多。需要了解摘要运行了多少次。甚至在控制器中使用您的过滤器$filter()

标签： angularjs angular-filters

【解决方案1】：

如果您想在控制器中使用 $filter（这肯定会更高效并修复无限 $digest 循环问题），您可以这样做：

angular.module('myApp', [])
.controller('myCtrl', function($scope, $filter) {
    $scope.items = [
    'one','two','three',
    'unos','dos','tres',
    'uno','due','tre'
    ]
    $scope.grouped = $filter('GroupsOf')($scope.items , 3)
    console.log($scope.grouped)
})
.filter('GroupsOf', function(){     
//Takes an array of things and groups them into  
// sub-arrays with numPerGroup things in each 
return function(things ,numPerGroup){
    var i, group = -1, res = []          
    for(i = 0; i < things.length ; i++){
        //if it's a new group:
        if(i % numPerGroup === 0){                  
            res.push([])
            group++
        }
        res[group].push(things[i])
    }
    return res
}
})

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  
<div ng-repeat="row in grouped" class="row">
    {{row}}
</div>


</div>

查看infdig 文档，您的问题似乎是由

引起的

.. 绑定到每次调用时都会生成一个新数组的函数。

这应该是 $digest 永远找不到干净状态的原因。

【讨论】：