Tags: angularjs directives, ng-repeat
Reading Time: 3 minutesThe ng-repeat directive is one of the most versatile directives in AngularJS, and can be used for a whole variety of situations and requirements. We saw how we can use it to repeat an array in the previous examples. In this section, we will explore some of the other options we have when using the ng-repeat directive. I […]
Tags: angularjs directives, arrays, ng-repeat
We have seen how to create a controller, and how to get data from the controller into the HTML. But we worked with very simplistic string messages. Let’s now take a look at how we would work with a collection of data; for example:
[codepen_embed height="265" theme_id="0" slug_hash="kkYWOY" default_tab="html,result" user="vishal_srini"]See the Pen <a href='http://codepen.io/vishal_srini/pen/kkYWOY/'>Displaying arrays</a> by Vishal Srinivasan (<a href='http://codepen.io/vishal_srini'>@vishal_srini</a>) on <a href='http://codepen.io'>CodePen</a>.[/codepen_embed]
We introduced a few new concepts in this example. Before we delve into those, Codepen Demo shows how the HTML and JS would look when we run it. ng-repeat example in codepen. First things first, we removed the message variable and introduced an array of JSON objects in our MainCtrl. We exposed this on the controller instance with the name notes.