Angular: ng-repeat scope - 14410993

http://angularjs.org/

by Keval Bhatt

HTML

<div ng-controller="MyCtrl">
    <div ng-repeat="line in parent">
        <div class="header">{{line.name}}</div>
        <table>
            <tr>
                <td ng-repeat="satellites in line.satellites">{{satellites.name}}
                    <div>{{satellites.image}}</div>
                </td>
            </tr>
            <tr>
                <td ng-repeat="continents in line.continents">{{continents.name}}
                    <div>{{continents.image}}</div>
                </td>
                <tr/>
        </table>
             <div class="header">Population</div>    
            <div>{{line.population.graph}}</div>    
    </div>
</div>

CSS

table {
    border: 1px solid black;
    width:100%;
}
td {
    border: 1px solid black;
    width:100%;
}
td div {
    border: 1px solid black;
    width:100%;
    height:50px;
}
.header {
    border: 1px solid black;
    width:100%;
    text-align:center;
}
tr div {
    border: 1px solid black;
    width:100%;
    height:50px;
}

JavaScript

var myApp = angular.module('myApp', []);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.parent = [{
        "satellites": [{
            "name": "satellite1Name",
                "gravitation": "gravitationalForce",
                "area": "squareKiloMeter",
                "subSatelliteCount": "someCount",
                "image": "/satellites/urlLocation"
        }, {
            "name": "satellite2Name",
                "gravitation": "gravitationalForce",
                "area": "squareKiloMeter",
                "subSatelliteCount": "someCount",
                "image": "/satellites/urlLocation"
        }],
            "continents": [{
            "name": "continent1Name",
                "numberofCountries": "someCount",
                "foundAt": "someDate",
                "foundBy": "somePersonName",
                "image": "/continents/urlLocation"
        }, {
            "name": "continent2Name",
                "numberofCountries": "someCount",
                "foundAt": "someDate",
                "foundBy": "somePersonName",
                "image": "/continents/urlLocation"
        }],
            "population": {
            "men": "count",
                "women": "count",
                "graph": "/population/urlLocation"
        },
            "name": "planet1Name",
            "year": "someDaysForOneYear",
            "distance": "distancefromSun",
            "day": "hoursInOneDay"
    }, {
        "satellites": [],
            "continents": [],
            "population": {},
            "name": "planet2Name",
            "year": "someDaysForOneYear",
            "distance": "distancefromSun",
            "day": "hoursInOneDay"
    }]
}