Фильтрация Угловые шаблоны по свойству JSON получает Digest бесконечный цикл

Question

Я пытаюсь отфильтровать результаты ng-repeat в шаблоне директивы. Ниже решение работает как в нем отображается также на экране, однако теперь я получаю ошибку: Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting! я ссылаться на эту страницу и решение не работает: https://docs.angularjs.org/error/ $ rootScope/infdig

Любые предложения о том, как я могу это исправить? Или лучший способ сделать это?

HTML:

<filtered-set items="businesses | filter : {cat: 'jedi'} : true | filter:query |orderBy: orderList"></filtered-set> 

Шаблон:

<div class="bscroll mThumbnailScroller" data-mts-axis="x"> 
    <ul> 
     <li class="business-card" data-ng-repeat="business in items" data-ng-click="select(business)"> 
     <h2>{{business.name}}</h2> 
     <p>{{business.cat}}</p> 
     </li> 
    </ul> 
    </div> 

Угловая JS:

.controller('starWarsCtrl', function ($scope) { 
    $scope.businesses = [ 
    {"name": "Obi-Wan Kenobi", 
    "index":88, 
     "cat": "jedi"}, 
    {"name": "Yoda", 
    "index":69, 
     "cat":"jedi"}, 
    {"name": "Lando", 
    "index":31, 
     "cat": "smuggler"}, 
    {"name": "Han Solo", 
    "index":90, 
     "cat": "smuggler"}, 
    {"name": "Darth Vader", 
    "index":98, 
     "cat": "sith"}, 
    {"name": "Jar-Jar Binks", 
    "index":80, 
     "cat": "alien"}, 
    {"name": "Mace Windu", 
    "index":45, 
     "cat": "jedi"}, 
    {"name": "Chewy", 
    "index":76, 
     "cat": "smuggler"} 
    ]; 

.directive('filteredSet', function() { 
    return { 
    restrict: 'E', 
    scope: { 
     items: '=' 
    }, 
    templateUrl: 'partials/filtered-set.html' 
    }; 
}); 

Answer 1

Там может быть способ решить мою выше вопрос, однако я нашел много лучшее решение, чтобы избежать этой проблемы. Вот что я сделал вместо этого:

Я создал эту функцию в моем контроллере, он в основном захватывает все свойства JSON соответствие с "cat" свойства:

 angular.forEach($scope.data, function(item) { 
    //item.cat is a string 
    if (categories.indexOf(item.cat) == -1) { 
     categories.push(item.cat); 
    } 
}); 
    return categories; 
    } 

и мой HTML, который является по существу ng-repeat в пределах ng-repeat :

<div data-ng-app="app" data-ng-controller="starWarsCtrl"> 
    <ul> 
     <li data-ng-repeat="cat in getCategories()"> 
      <h2>{{cat}}</h2> 
      <div ng-click="select(i)" ng-repeat="i in data | filter:{cat: cat}"> 
    <p>{{i.name}}</p> 
    </div> 
     </li> 
    </ul> 
</div> 

Я также создал Codepen с моим решением: http://codepen.io/Auzy/pen/adeqrP

Надеюсь, это поможет!