I'm trying to get the name to show for each element, but I'm getting the same name for each element. Here's the code:
View:
<li class="list-group-item" ng-controller="MenuItemEditTypeaheadCtrl">
<input type="text" ng-model="selectedItem" typeahead="menuItem.name for name in menuItems | limitTo:3" class="typeahead">
</li>
JSON:
[{name: "Soda", price: "2.99"}, {name: "Chips", price: "0.99"}]
text=[{name: "Soda", price: "2.99"}, {name: "Chips", price: "0.99"}];
obj=JSON.parse(text);
Print obj using loop
obj[0].name will print "Soda" obj[1].name will print "Chips"
This is the correct answer:
"menuItem.name for menuItem in menuItems | limitTo:5 | filter:{name:$viewValue}"
try like below
Script:
$scope.menuItems = [{name: "Soda", price: "2.99"}, {name: "Chips", price: "0.99"}];
HTML:
<li class="list-group-item" ng-controller="MenuItemEditTypeaheadCtrl">
<input type="text" ng-model="selectedItem" typeahead="menuItem.name for menuItem in menuItems | filter:$viewValue | limitTo:3 " class="typeahead">
</li>
Note: $viewValue corresponds to a value entered by a user
And if you want to tie your angular typeahead with a server then refer this below link
How to tie angular-ui's typeahead with a server via $http for server side optimization?