Sunday, 23 April 2017

AngularJS-8 : recursive ng-repeat

AngularJS-8 : recursive ng-repeat


angular.min.js
-------------------------------------


Script.js
------------------------------------

/// <reference path="angular.min.js" />

var myAppModule = angular.module("myAppModule",[]).controller("myDataController",function ($scope) {
        var countries =
            [
                {
                    name : "USA",
                    cities : [
                            {name: "Sanfransico"},
                            {name: "Newyork"}
                        ]
                },
                {
                     name : "India",
                    cities : [
                            {name: "Bangalore"},
                            {name: "Mumbai"}
                        ]
                }
            ]
    $scope.countries = countries;
});




myHTML.html
---------------------------------------


<!DOCTYPE html>
<html ng-app="myAppModule">
    <head>
        <script type="text/javascript" src="resources/js/angular.min.js"></script>
        <script type="text/javascript" src="resources/js/Script.js"></script>
    </head>
    <body ng-controller="myDataController">
  
        <ul>
            <li ng-repeat="country in countries">
                {{country.name}}
                <ul>
                    <li ng-repeat="city in country.cities">
                        {{city.name}}
                    </li>
                </ul>
            </li>
        </ul>
       
   
    </body>
</html>

No comments:

Post a Comment

AngularJS-24 : Router

AngularJS-24 : Router https://www.youtube.com/watch?v=hThmoKA9aeU#t=427.383649 Download "angular-route.min.js"and add to p...