How to use typeahead-on-select in Angular JS?

Question

I use typeahead-on-select from bootstrap Angular JS. Now I have writtem HTML code:

<input type="text" ng-model="data.country[formData.country]" placeholder="Select country..." typeahead-on-select="onSelect($item, $model, $label)" typeahead="stuff as stuff.name for stuff in countries | filter:{name: $viewValue} | orderBy:stuff.name" aria-expanded="false" aria-owns="typeahead-16-5649">

When I enter symbol a on this input I get autocomplete unsorted result without countries are named from this symbol. What I do wrong?

Answer 1

When we use angular type ahead we need to use custom filter function which manipulates the list and return the suggestions based on the code written in custom filter.

typeahead="state as state.code +' - '+ state.name for state in Item|      filter:$viewValue:customFilterFunction" 

Here customeFilterfunction is defined inside controller which returns the suggestion list in desired order.

$scope.customFilterFunction = function(state,value){

    return state;

}

we can write any logic and sort the suggestions as per our requirement.