ordina per più campi in angolare

Come ordinare usando più campi contemporaneamente in angolare? pugno per gruppo e poi per sottogruppo per esempio

$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}];

Volevo visualizzare questo come

gruppo: sottogruppo

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'" />

Si prega di vedere questo:

http://jsfiddle.net/JSWorld/Hp4W7/32/

<div ng-repeat="division in divisions | orderBy:['group','sub']">{{division.group}}-{{division.sub}}</div>

Se vuoi ordinare su campi multipli all'interno del controller usa questo

$filter('orderBy')($scope.property_list, ['firstProp', 'secondProp']);

Vedi anche https://docs.angularjs.org/api/ng/filter/orderBy

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

Matrice utente anziché ordine multiplo

L'ordinamento può essere effettuato utilizzando il filtro 'orderBy' in angolare.

Due modi: 1. Dalla vista 2. Dal controller

1. Dalla vista

Sintassi:

{{array | orderBy : expression : reverse}} 

Per esempio:

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

2. Dal controller

Sintassi:

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

Per esempio:

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

Esistono 2 modi per eseguire i filtri AngularJs, uno nell'HTML che utilizza {{}} e uno nei file JS effettivi ...

Puoi risolvere il tuo problema usando:

{{ Expression | orderBy : expression : reverse}}

se lo usi in HTML o usi qualcosa del tipo:

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

Il retro è opzionale alla fine, accetta un valore booleano e, se è vero, invertirà l'array per te, un modo molto utile per invertire l'array ...

Ho scritto questo utile pezzo per ordinare in base a più colonne / proprietà di un oggetto. Con ogni clic successivo della colonna, il codice memorizza l'ultima colonna selezionata e la aggiunge a un elenco crescente di nomi di stringhe di colonne cliccate, posizionandole in un array chiamato sortArray. Il filtro angolare "orderBy" incorporato legge semplicemente l'elenco sortArray e ordina le colonne in base all'ordine dei nomi delle colonne memorizzati. Quindi l'ultimo nome della colonna su cui si fa clic diventa il filtro ordinato principale, il precedente ha fatto clic sul successivo in precedenza, ecc. L'ordine inverso influisce sull'ordine di tutte le colonne contemporaneamente e attiva / disattiva il set di elenchi di array completo:

<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>

Creato pipe per l'ordinamento. Accetta stringhe e array di stringhe, ordinandole per più valori. Funziona per Angular (non AngularJS). Supporta sia l'ordinamento per stringa che per i numeri.

@Pipe({name: 'orderBy'})
export class OrderBy implements PipeTransform {
    transform(array: any[], filter: any): any[] {
        if(typeof filter === 'string') {
            return this.sortAray(array, filter)
        } else {
            for (var i = filter.length -1; i >= 0; i--) {
                array = this.sortAray(array, filter[i]);
            }

            return array;
        }
    }

    private sortAray(array, field) {
        return array.sort((a, b) => {
            if(typeof a[field] !== 'string') {
                a[field] !== b[field] ? a[field] < b[field] ? -1 : 1 : 0
            } else {
                a[field].toLowerCase() !== b[field].toLowerCase() ? a[field].toLowerCase() < b[field].toLowerCase() ? -1 : 1 : 0
            }
        });
    }
}

Assicurarsi che l'ordinamento non sia complicato per l'utente finale. Ho sempre pensato che l'ordinamento per gruppo e sottogruppo fosse un po 'complicato da capire. Se si tratta di un utente finale tecnico, potrebbe essere OK.