角度错误:达到10$digest()迭代

Angular error: 10 $digest() iterations reached

本文关键字:digest 迭代 错误 达到      更新时间:2023-09-26

我正在尝试做一个过滤器,它将根据确定的字段对我的收藏项目进行分组(如角度过滤器库中的groupBy过滤器)

app.filter('groupBySortedField', function() {
  return function(collection, property) {
    var result = {};
    angular.forEach(collection, function(item) {
      var prop = item[property];
      if (!result[prop]) {
        result[prop] = [];
      }
      result[prop].push(item);
    });
    return result;
  };
});

它运行得很好,但我在控制台中遇到了很多错误:

未捕获错误:已达到[$rootScope:infdig]10$digest()迭代。

看看打开控制台的示例http://plnkr.co/edit/HFlB7VTMCe2GnM3SUirs?p=preview

如何修复?

我完全同意Daniel给出的答案。

为了更好地理解,我想在这里展示一个简单的解决方案,如果可以在任何绑定和观察程序激活之前进行排序。

// Code goes here
var app = angular.module('test', []);
app.controller('TestCtrl', ['$scope', function($scope) {
  var events = [{
      startDate: new Date('Tue Nov 24 2015 03:05:00'),
      name: '111'
    }, 
    {
      startDate: new Date('Tue Nov 24 2015 03:05:00'),
      name: '222'
    },
    {
      startDate: new Date('Tue Nov 24 2015 04:05:00'),
      name: '333'
    },
    {
      startDate: new Date('Tue Nov 24 2015 04:05:00'),
      name: '444'
    }
  ];
  $scope.orderedEvents = getEvents(events,'startDate');
  
  function getEvents (collection,property) {
    var result = {};
    angular.forEach(collection, function(item) {
      var prop = item[property];
      if (!result[prop]) {
        result[prop] = [];
      }
      result[prop].push(item);
    });
    return result;
    
  }
}]);
<!DOCTYPE html>
<html>
<head>
  <script data-require="angular.js@*" data-semver="1.4.7" src="https://code.angularjs.org/1.4.7/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>
<body ng-app="test" ng-controller="TestCtrl">
  <ul ng-repeat="(startDate, eventsList) in orderedEvents">
    <li>{{eventsList[0].startDate}}</li>
    <li ng-repeat="event in eventsList">{{event.name}}</li>
  </ul>
  
</body>
</html>

演示