Debes entender una cosa sobre los filtros de angular: ¡¡¡el orden importa!!! y la regla es que estos se ejecutan en el mismo orden que se escriben de izquierda a derecha.
{{expresion | filtro1:parametro | filtro2:parametro | filtro3:parametro }}
Primero angular te evaluará la expresión, el resultado de esta evaluación será el la entrada de filtro1
, el resultado de este procesamiento será la entrada de filter2
y así sucesivamente mientras se encuentren filtros en la expresión completa.
Para que entiendas mejor esto te voy a escribir tu mismo filtro pero por partes, agregando un filtro más por cada ng-repeat
para que compruebes los resultados de cada aplicación
angular.module('app', [])
.controller('CollectionCtrl', function($scope) {
// collecione de datos
$scope.collecion = [{
nombre: 'Juan',
tipo: 'persona'
}, {
nombre: 'Lassie',
tipo: 'perro'
}, {
nombre: 'Pedro',
tipo: 'persona'
}, {
nombre: 'Eduardo',
tipo: 'persona'
}, {
nombre: 'Rintintin',
tipo: 'perro'
}, {
nombre: 'Frank',
tipo: 'persona'
}];
});
hr {
margin: 20px 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="CollectionCtrl">
<h3>Collecion completa</h3>
<div ng-repeat="obj in collecion">
{{obj.nombre}}
</div>
<hr>
<h3>
Collecion filtrada tipo: 'persona'
</h3>
<div ng-repeat="obj in collecion | filter: {tipo: 'persona'}">
{{obj.nombre}}
</div>
<hr>
<h3>
Collecion filtrada y ordenada
</h3>
<div ng-repeat="obj in collecion | filter: {tipo: 'persona'} | orderBy : 'nombre'">
{{obj.nombre}}
</div>
<hr>
<h3>
Collecion filtrada, ordenada y limitada a 2 resultados
</h3>
<div ng-repeat="obj in collecion | filter: {tipo: 'persona'} | orderBy : 'nombre' | limitTo: 2">
{{obj.nombre}}
</div>
</div>
Así que si no obtienes los resultados correctamente es quizás porque el filtro filter
no lo tienes bien escrito o no te están llegando los datos correctamente ya que orderBy
no cambia la cantidad de ítems obtenidos, solo filter
y limitTo
lo hacen. Este ultimo es un equivalente de algo como
var resultado = collecion.slice(0, cantidad);