Tri alphabétique d'une liste déroulante en AngularJS

Question

Je remplis une liste déroulante à l'aide de ng-options qui est reliée à un contrôleur qui, à son tour, appelle un service. Malheureusement, les données qui arrivent sont désordonnées et je dois être capable de les trier par ordre alphabétique.

Vous pensez que quelque chose comme $.sortBy devrait le faire mais malheureusement ça n'a rien donné. Je sais que je peux le faire via javascript avec une méthode d'aide. function asc(a,b) ou quelque chose comme ça, mais je refuse de croire qu'il n'existe pas de moyen plus propre de faire cela, et je ne veux pas encombrer le contrôleur de méthodes d'aide. C'est quelque chose de si basique en principe que je ne comprends pas pourquoi AngularJS n'en dispose pas.

Y a-t-il un moyen de faire quelque chose comme $orderBy('asc') ?

Exemple :

<select ng-option="items in item.$orderBy('asc')"></select>

Il serait extrêmement utile de disposer d'options dans orderBy donc vous pouvez faire ce que vous voulez, quand vous essayez habituellement de trier des données.

Answer 1

Angular dispose d'un orderBy qui peut être utilisé comme ceci :

<select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name'"></select>

Ver ce violon pour un exemple.

Answer 2

Vous devriez être en mesure d'utiliser le filtre. L'option 'orderBy' peut accepter une troisième option pour l'indicateur 'reverse'.

<select ng-option="item.name for item in items | orderBy:'name':true></select>

Ici, l'élément est trié par la propriété "nom" dans un ordre inversé. Le deuxième argument peut être n'importe quelle fonction d'ordre, donc vous pouvez trier dans n'importe quelle règle.

@see http://docs.angularjs.org/api/ng.filter:orderBy

Answer 3

var module = angular.module("example", []);

module.controller("orderByController", function ($scope) {
    $scope.orderByValue = function (value) {
        return value;
    };

    $scope.items = ["c", "b", "a"];
    $scope.objList = [
        {
            "name": "c"
        }, {
            "name": "b"
        }, {
            "name": "a"
        }];
        $scope.item = "b";
    });

http://jsfiddle.net/Nfv42/65/

Answer 4

Pour ceux qui veulent trier la variable en troisième couche :

<select ng-option="friend.pet.name for friend in friends"></select>

vous pouvez le faire comme ceci

<select ng-option="friend.pet.name for friend in friends | orderBy: 'pet.name'"></select>

Answer 5

Ce travail pour moi

<select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name'"></select>