beginner ng-repeat not working

Priya Mohan

unread,

Jul 1, 2016, 7:55:12 AM7/1/16

to AngularJS

Hi - I am a beginner in anjularjs and trying the below code.

<html ng-app="myAPP">
<head>
    <meta charset="utf-8">
    <title>Angular.js JSON Fetching Example</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
	<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
   
<script>
var myapp = angular.module("myAPP", []);
myapp.controller('simplectrl', function($scope, $http) {
$http.get('countries.json').success(function(data) {
    console.log(data);
    $scope.countries=data.countries;
    });
});
</script>
</head>


<body ng-controller="simplectrl">

<h3> Country Data </h3>

<table>
    <tr>
    <th> Country </th>
    <th> Population </th>
    </tr>


    <tr ng-repeat="country in countries">
    <td> {{country.name}}</td>
    <td>{{country.population}}</td>
    </tr>
 </table>

</body>
</html>

and my countries.json is

{ "countries" :[
               { "name": "China", "population" :"1.4billion" },
               { "name": "India", "population" :"1.2billion" },
               { "name": "USA", "population":"300million" }
]};

when I run the htm file in web server, I don't see the result ex:China,1.4billion under table heading. please help

Message has been deleted

Shivendra

unread,

Jul 4, 2016, 12:43:16 AM7/4/16

to AngularJS

You'll have to run json-server first and then do $http.get('http://localhost:port_no/countries') to get the countries json

Reply all

Reply to author

Forward