Mam tablicę obiektów, tj. Filtrowaną i stronicowaną, a teraz chciałbym zamówić elementy listy według różnych atrybutów obiektów.Angularjs - użycie filtru porządkowego w zakresie kontrolera
próbowałem filtr orderBy
następująco:
<th><a href='' ng-click="reverse = sortParam == 'title' && !reverse; sortParam = 'title'">Title</a></th>
<tr ng-repeat="item in pagedItems|filter:filterParam|orderBy:sortParam:reverse">
<td>{{ item.title }}</td>
</tr>
To wydaje się działać dobrze, klikając na link Title
, nakazuje wiersz alfabetycznie lub alfabetycznie odwrotnej zależności od aktualnego stanu.
Ale problem polega na tym, że zamawiane są tylko pagedItems
, co ma sens, gdy stosujemy filtr orderBy
do pagedItems
. Chcę tylko zamówić cały zestaw przedmiotów (nie tylko obecnie stronicowanych), które będą zamawiane po zastosowaniu filtra.
Aby to osiągnąć, pomyślałem, że użyłbym metody z zakresu kontrolera. Zmieniłem więc powyższe do:
/** In the Template */
<th><a href='' ng-click="sortItems('title')">Title</a></th>
<tr ng-repeat="item in pagedItems|filter:filterParam">
<td>{{ item.title }}</td>
</tr>
/** In the Controller */
$scope.sortItems = function(value) {
$scope.filtered = $filter('orderBy')($scope.filtered, value);
};
$scope.$watch('currentPage + numPerPage + filtered', function() {
$scope.pagedItems = getPagedItems($scope, 'filtered');
});
The sortItems
prac metody i zmienia kolejność, ale pozycje w widoku nie zostanie zaktualizowany kod $watch
nie zostanie zwolniony. Zakładam, że być może nie zostanie to zmienione, ponieważ dane w $scope.filtered
nie są zmieniane i tylko indeksy są zmieniane. Więc dodałem i pusty element na koniec tablicy:
$scope.sortItems = function(value) {
$scope.filtered = $filter('orderBy')($scope.filtered, value);
$scope.filtered.push({});
};
Teraz wszystko działa zgodnie z oczekiwaniami, ale nie mogę utrzymać pusty obiekt w tablicy, jak to wpływa na elementy, liczyć i wyświetlania danych. Więc pomyślałem, że dodam i usuniemy pusty przedmiot. Więc zmienił wyżej:
$scope.sortItems = function(value) {
$scope.filtered = $filter('orderBy')($scope.filtered, value);
$scope.filtered.push({});
$scope.filtered.pop();
};
Ale zgadnijcie co nie kod $watch
czym ponownie zwolniony.
Pytanie
Moje pytanie jest nie $watch
wygląd zmian w tablicy oparta na jego długość? Jeśli tak, jaki jest najlepszy sposób, aby osiągnąć to, co próbuję. Każda pomoc będzie doceniona.