Ответ 1
Похоже, что настоящая проблема заключается в том, что вы изменяете свой ввод, вместо того, чтобы создавать новую переменную и выводить ее из вашего фильтра. Это заставит часы смотреть на все, что смотрит переменную, которую вы вводили.
На самом деле нет причин добавлять "сгруппированную == истинную" проверку там, потому что у вас должен быть полный контроль над вашими собственными фильтрами. Но если это необходимо для вашего приложения, то вы хотите добавить "grouped == true" к результату вашего фильтра, а не к входу.
Как работают фильтры, они меняют ввод и возвращают что-то другое, затем следующий фильтр обрабатывает результат предыдущих фильтров... поэтому ваша "фильтрованная" проверка будет в основном невосприимчивой item in items | filter1 | filter2 | filter3
, где filter1 фильтрует элементы, фильтры filter2 результат filter1 и filter3 фильтрует результат фильтра 2... если это имеет смысл.
Вот что я просто взбивал. Я не уверен (пока), если он работает, но он дает вам основную идею. Вы возьмете массив с одной стороны, и вы выплюнете массив массивов на другом.
app.filter('group', function(){
return function(items, groupSize) {
var groups = [],
inner;
for(var i = 0; i < items.length; i++) {
if(i % groupSize === 0) {
inner = [];
groups.push(inner);
}
inner.push(items[i]);
}
return groups;
};
});
HTML
<ul ng-repeat="grouping in items | group:3">
<li ng-repeat="item in grouping">{{item}}</li>
</ul>
ИЗМЕНИТЬ
Возможно, было бы лучше увидеть все эти фильтры в вашем коде, но похоже, что это вызывает проблемы, потому что его постоянно нужно переоценивать на $digest. Поэтому я предлагаю вам сделать что-то вроде этого:
app.controller('MyCtrl', function($scope, $filter) {
$scope.blueprints = [ /* your data */ ];
$scope.currentPage = 0;
$scope.pageSize = 30;
$scope.groupSize = 3;
$scope.sortPty = 'stuff';
//load our filters
var orderBy = $filter('orderBy'),
startFrom = $filter('startFrom'),
limitTo = $filter('limitTo'),
group = $filter('group'); //from the filter above
//a method to apply the filters.
function updateBlueprintDisplay(blueprints) {
var result = orderBy(blueprints, $scope.sortPty);
result = startForm(result, $scope.currentPage * $scope.pageSize);
result = limitTo(result, $scope.pageSize);
result = group(result, 3);
$scope.blueprintDisplay = result;
}
//apply them to the initial value.
updateBlueprintDisplay();
//watch for changes.
$scope.$watch('blueprints', updateBlueprintDisplay);
});
затем в вашей разметке:
<ul ng-repeat="grouping in blueprintDisplay">
<li ng-repeat="item in grouping">{{item}}</li>
</ul>
... Я уверен, что там есть опечатки, но это основная идея.
ИЗМЕНИТЬ СНОВА: Я знаю, что вы уже приняли этот ответ, но есть еще один способ сделать это, я недавно узнал, что вам может понравиться лучше:
<div ng-repeat="item in groupedItems = (items | group:3 | filter1 | filter2)">
<div ng-repeat="subitem in items.subitems">
{{subitem}}
</div>
</div>
Это создаст новое свойство в вашей области $под названием $scope.groupedItems "на лету", которое должно эффективно кэшировать ваши отфильтрованные и сгруппированные результаты.
Дайте ему вихрь и сообщите мне, если это сработает для вас. Если нет, я думаю, что другой ответ может быть лучше.