AngularJS typeahead ajouter tri personnalisé par fonction

Question

Je suis en train de construire une typeahead qui devrait obtenir un nombre spécifié de résultats et les trier par startswith. Cela signifie que si j'ai les valeurs suivantes: Alabama, Missouri, Maryland, Massachusetts, etc. et que vous saisissez le champ de saisie "m" ou "M", l'ordre doit être Maryland, Missouri, Massachusetts, Alabama.

donc mon code ressemble à ceci:

<input class="input-large" type="text" ng-model="selected" 
    typeahead="state for state in states | filter:$viewValue | limitTo:8"> 

J'ai essayé en ajoutant une fonction de filtre personnalisé:

<input class="input-large" type="text" ng-model="selected" 
    typeahead="state for state in states | filter:$viewValue | orderBy:orderByStartsWith()| limitTo:8"> 

avec la fonction:

$scope.orderByStartsWith = function() { 
    return function(element){ 
     return element.toLowerCase().startsWith($scope.selected.toLowerCase()) ? 0 : 1;   
    } 
}; 

Ce ne fonctionne pas , car la valeur de la portée selected ne se met pas à jour comme indiqué dans cette JSFiddle

Existe-t-il une solution pour obtenir l'ordre souhaité?

Answer 1

Passez le $ viewValue à la commande d'après votre fonction et de trier les résultats.

<input class="input-large" type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue | orderBy:orderByStartsWith($viewValue) | limitTo:8"> 

$scope.orderByStartsWith = function(viewValue) { 
     return function(element){ 
     return element.toLowerCase().startsWith(viewValue.toLowerCase()) ? 0 : 1;   
     } 
    }; 

contrôle du violon: http://jsfiddle.net/2umL5yqL/1/