Angularjs typeahead name undefined

Question

I am getting undefined when the result is returned, can anyone help me out here? I know there's a similar question out there but i couldn't understand the solution. Thus, asking again.

JS:

 $scope.cnames = CombinedName;
 console.log($scope.cnames)

Console log view :

Lastly, my html code :

      <input type="text" ng-model="selected" uib-typeahead="NAME 
     for cname in cnames | filter:$viewValue | limitTo:8">

View im getting :

There isn't a NAME property on each cname, because each cname is a string. Try something like cname for cname in cnames instead. — Claies
– Claies, Commented Oct 12, 2018 at 2:04
bear in mind, because cnames is an array of strings, selected will be the index of the element in the array, rather than the text itself. if you want the text, then cname as cname for cname in cnames would probably work. — Claies
– Claies, Commented Oct 12, 2018 at 2:08
wow, that just did the trick. Thanks a million times @Claies!! — Stanley Ang
– Stanley Ang, Commented Oct 12, 2018 at 2:08

Sajeetharan · Accepted Answer · 2018-10-12 02:12:18Z

1

You can just just bind it as ,

<input type="text" ng-model="selected" typeahead="cname for cname in cnames | filter:$viewValue | limitTo:8" class="form-control">

DEMO

answered Oct 12, 2018 at 2:12

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Claies · Accepted Answer · 2018-10-12 02:14:36Z

Because the cnames array you are working with is a string, you have to use a specific form when iterating through the array. In general, ng-options / uib-typeahead expect the array you are iterating to be an array of objects.

When working with an array of strings, you can use

cname for cname in cnames

to correctly assign the text of the dropdown to the text of the array element. This will set the selected value to the index of the selected element from the source array.

cname as cname for cname in cnames

would set the selected value as the text itself.

all the possible forms are documented at https://docs.angularjs.org/api/ng/directive/ngOptions. These are the same forms that are used by UI-Bootstrap.

Collectives™ on Stack Overflow

Angularjs typeahead name undefined

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related