Search code examples
angularjstwitter-bootstrapangular-ui-bootstrapbootstrap-typeahead

Input field shows model value instead of label after select


After selecting an item in the typeahead dropdown, the input field reflects the item's value (now the bound model's value). How would I go about using the label for input value. Is there support here in typeahead directive which I'm not seeing?

My expression:

person.id as person.name for person in persons

I've also tried using using typeahead-input-formatter, but that only has the $model (value) property available, not the label.

Plunker http://plnkr.co/edit/OylBlT5KxNvKtTHac61f?p=preview


Solution

  • I may be using typeahead with slightly different intentions. I realized that a better approach would be to bind the typeahead to a garbage(unused) property, and utilize something like <input ... typeahead-on-select="realBinding = $item.id">