Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use ng-repeat to iterate over map entries in AngularJS

Tags:

angularjs

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> 
like image 202
Alex Spurling Avatar asked Feb 05 '13 09:02

Alex Spurling


People also ask

What is the use of NG-repeat in AngularJS?

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.

How do you pass an index in NG-repeat?

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 .

What is $Index in AngularJS?

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}}.

How do I iterate a map in JavaScript?

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.


1 Answers

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> 
like image 185
Alex Spurling Avatar answered Sep 21 '22 00:09

Alex Spurling