AngularJS Tutorial - Iterating with the ng-repeat Directive

First we use directive called ng-init to define values then use another directive in AngularJS called ng-repeat.

Example


<!DOCTYPE html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js">
</script><!--   w  w  w .j  a v  a  2s.  co  m-->
</head>
<body>
    <div data-ng-init="names=['XML','CSS','HTML','Javascript']">
        <ul>
            <li data-ng-repeat="name in names">{{name}}</li>
        </ul>
    </div>
</body>
</html>

The code above is rendered as follows:

ng-repeat loops through all the names, and then data-bind or apply the value into the <li>.