Liste déroulante de tri alphabétique dans AngularJS
Je remplis une liste déroulante grâce à l'utilisation de ng-options qui est accrochée à un contrôleur qui appelle à son tour un service. Malheureusement, les données qui arrivent sont un gâchis et je dois être capable de les Trier par ordre alphabétique.
Vous pensez que quelque chose comme $.sortBy le ferait mais malheureusement cela n'a pas fait jack. Je sais que je peux le trier 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'y a pas de façon plus propre de le faire plus Je ne veux pas gonfler le contrôleur avec des méthodes d'aide. C'est quelque chose de si basique en principe, donc je ne comprends pas pourquoi AngularJS n'a pas cela.
Est-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 d'avoir des options dans orderBy afin que vous puissiez faire ce que vous voulez, chaque fois que vous essayez habituellement de trier les données.
4 réponses
Angular a un filtre orderBy qui peut être utilisé comme ceci:
<select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name'"></select>
Voir ce violon pour un exemple.
, Il est intéressant de noter que si track by est utilisé, il doit apparaître après la orderBy filtre, comme ceci:
<select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name' track by f.id"></select>
Vous devriez pouvoir utiliser filter: orderBy
orderBy peut accepter une troisième option pour la reverse drapeau.
<select ng-option="item.name for item in items | orderBy:'name':true"></select>
Ici l'élément est trié par la propriété 'name' dans un ordre inversé. Le 2ème argument peut être n'importe quelle fonction d'ordre, de sorte que vous pouvez trier dans toute règle.
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";
});
Pour tous 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>