AngularJS typeahead select on blur

Question

I'm using typeahead through in my AngularJS project and I would like to have it select the entry if I type the full value and click out of the field.

I've put together an example of what I mean

http://plnkr.co/edit/NI4DZSXofZWdQvz0Y0z0?p=preview

<input class='typeahead' type="text" sf-typeahead options="exampleOptions" datasets="numbersDataset" ng-model="selectedNumber">

If I type in 'two' and click on 'two' from the drop down then I get the full object {id: 2, name: 'two'}. This is good, if however I type 'two' and click to the next field without selecting is there a way to accept the top of the list on loss of focus on a text field?

Answer 1

I'm not sure if I'd want to have that sort of functionality in my app. The user hasn't actually selected anything. So selecting something for them would introduce frustrations.

But I do understand that often odd requirements are needed. In this case, I'd attack it using ngBlur. Assign a function to be called on blur. You can grab the contents of ng-model and then loop through your data (assuming static & not being sent via server) to find a match.

You can most likely just look at the source code of your typeahead directive and strip out the part does the comparison and then choose the first item in the array.