Search code examples
angularjsbootstrap-typeaheadangular-strap

angular strap typeahead filter otions issue


I am trying to use typeahead from angular strap.

I have array for typeahead:

`$scope.icons = [
    {value: 'idGear', label: 'Gear'},
    {value: 'idGlobe', label: 'Globe'},
    {value: 'oidHeart', label: 'Heart'},
    {value: 'camera', label: 'Camera'}
  ];`

and want to filter array on label so I added:

bs-options="icon.value as icon.label for icon in icons|filter:{label:$viewValue}"

but when I select first item in input I see value(idGear) but not label (Gear) It works fine for last item {value: 'camera', label: 'Camera'} if value is allmoust the same as label

here is planker with issue demonstartion http://plnkr.co/edit/blXEtsCG9RRBctkniHAW?p=preview

Thanks for any help.


Solution

  • Why not pass it the full object and from there you can manipulate it accordingly:

    <input type="text" 
    class="form-control"
    ng-model="selectedIcon" 
    data-min-length="0" 
    data-html="1"
    bs-options="icon as icon.label for icon in icons|filter:{label:$viewValue}" 
    placeholder="Enter icon" bs-typeahead>
    

    i.e. if you want to use the value

    var myval = selectedIcon.value;
    var mylab = selectedIcon.Label;