orderby multiple javascript angularjs sorting angularjs-ng-repeat angularjs-orderby

javascript - multiple - order by angular 4



ordenar por campos mĂșltiples en angular (7)

¿Cómo ordenar usando múltiples campos al mismo tiempo en angular? puño por grupo y luego por subgrupo para Ejemplo

$scope.divisions = [{''group'':1,''sub'':1}, {''group'':2,''sub'':10}, {''group'':1,''sub'':2},{''group'':1,''sub'':20},{''group'':2,''sub'':1}, {''group'':2,''sub'':11}];

Quería mostrar esto como

grupo: subgrupo

1 - 1

1 - 2

1 - 20

2 - 1

2 - 10

2 - 11

<select ng-model="divs" ng-options="(d.group+'' - ''+d.sub) for d in divisions | orderBy:''group'' | orderBy:''sub''" />


Asegúrese de que la clasificación no sea complicada para el usuario final. Siempre pensé que clasificar en grupo y subgrupo es un poco complicado de entender. Si es un usuario final técnico podría estar bien.


Escribí esta práctica pieza para ordenar por múltiples columnas / propiedades de un objeto. Con cada clic de columna sucesivo, el código almacena la última columna pulsada y la agrega a una lista creciente de nombres de cadenas de columnas pulsadas, colocándolas en una matriz llamada sortArray. El filtro Angular incorporado "orderBy" simplemente lee la lista sortArray y ordena las columnas por el orden de los nombres de columna almacenados allí. Por lo tanto, el último nombre de columna en el que se hizo clic se convierte en el filtro ordenado primario, el anterior en el que se hizo clic en el siguiente en precedencia, etc. El orden inverso afecta al orden de todas las columnas a la vez y alterna ascendente / descendente para el conjunto completo de la lista de matrices:

<script> app.controller(''myCtrl'', function ($scope) { $scope.sortArray = [''name'']; $scope.sortReverse1 = false; $scope.searchProperty1 = ''''; $scope.addSort = function (x) { if ($scope.sortArray.indexOf(x) === -1) { $scope.sortArray.splice(0,0,x);//add to front } else { $scope.sortArray.splice($scope.sortArray.indexOf(x), 1, x);//remove $scope.sortArray.splice(0, 0, x);//add to front again } }; $scope.sushi = [ { name: ''Cali Roll'', fish: ''Crab'', tastiness: 2 }, { name: ''Philly'', fish: ''Tuna'', tastiness: 2 }, { name: ''Tiger'', fish: ''Eel'', tastiness: 7 }, { name: ''Rainbow'', fish: ''Variety'', tastiness: 6 }, { name: ''Salmon'', fish: ''Misc'', tastiness: 2 } ]; }); </script> <table style="border: 2px solid #000;"> <thead> <tr> <td><a href="#" ng-click="addSort(''name'');sortReverse1=!sortReverse1">NAME<span ng-show="sortReverse1==false">&#9660;</span><span ng-show="sortReverse1==true">&#9650;</span></a></td> <td><a href="#" ng-click="addSort(''fish'');sortReverse1=!sortReverse1">FISH<span ng-show="sortReverse1==false">&#9660;</span><span ng-show="sortReverse1==true">&#9650;</span></a></td> <td><a href="#" ng-click="addSort(''tastiness'');sortReverse1=!sortReverse1">TASTINESS<span ng-show="sortReverse1==false">&#9660;</span><span ng-show="sortReverse1==true">&#9650;</span></a></td> </tr> </thead> <tbody> <tr ng-repeat="s in sushi | orderBy:sortArray:sortReverse1 | filter:searchProperty1"> <td>{{ s.name }}</td> <td>{{ s.fish }}</td> <td>{{ s.tastiness }}</td> </tr> </tbody> </table>


Hay 2 formas de hacer filtros AngularJs, uno en el HTML usando {{}} y uno en archivos JS reales ...

Puedes resolver tu problema usando:

{{ Expression | orderBy : expression : reverse}}

Si lo usas en el HTML o usas algo como:

$filter(''orderBy'')(yourArray, yourExpression, reverse)

El reverso es opcional al final, acepta un booleano y, si es cierto, revertirá el Array para usted, una forma muy útil de revertir su Array ...


La clasificación se puede hacer usando el filtro ''orderBy'' en angular.

Dos formas: 1. Desde la vista 2. Desde el controlador

  1. Desde la vista

Sintaxis:

{{array | orderBy : expression : reverse}}

Por ejemplo:

<div ng-repeat="user in users | orderBy : [''name'', ''age''] : true">{{user.name}}</div>

  1. Desde el controlador

Sintaxis:

$filter.orderBy(array, expression, reverse);

Por ejemplo:

$scope.filteredArray = $filter.orderBy($scope.users, [''name'', ''age''], true);




<select ng-model="divs" ng-options="(d.group+'' - ''+d.sub) for d in divisions | orderBy:[''group'',''sub'']" />

Matriz de usuario en lugar de múltiples orderBY