How would you iterate over the entries in map such that both the entry key and the value can be printed? For example, I'd like to do something like this:
<ul> <li ng-repeat='mapEntry in {"First Name":"John", "Last Name":"Smith"}'> <span>Key: {{mapEntry.key}}, value: {{mapEntry.value}}</span> </li> </ul>
AngularJS ng-repeat Directive The ng-repeat directive repeats a set of HTML, a given number of times. The set of HTML will be repeated once per item in a collection. The collection must be an array or an object. Note: Each instance of the repetition is given its own scope, which consist of the current item.
Each ng-repeat creates a child scope with the passed data, and also adds an additional $index variable in that scope. So what you need to do is reach up to the parent scope, and use that $index .
Stay on the bleeding edge of your favorite technologies. $index is a way to show which iteration of a loop you're in. If we set up an ng-repeat to repeat over the letters in 'somewords', like so: <div ng-app="app"> <div ng-repeat="item in 'somewords'.split('')"> {{$index + 1}}.
Iterate through a Map using JavaScript # Use the forEach() method to iterate over a Map object. The forEach method takes a function that gets invoked for each key/value pair in the Map , in insertion order. The function gets passed the value, key and the Map object on each iteration.
From the docs, I found this syntax works:
<ul> <li ng-repeat='(key, value) in {"First Name":"John", "Last Name":"Smith"}'> <span>Key: {{key}}, value: {{value}}</span> </li> </ul>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With