Issue
Currently working on Angular. I am trying to get the data from JSON file and I am showing the result in Ul format. When I searched in Stack Overflow, I found this link. I am trying to do the same but still I am not solving it.
This is what I am trying here in the controller:
'use strict';
var app = angular.module('myApp', []);
app.controller('MyController', function($scope, $http){
$http.get('sample.json').then(function (response){
$scope.items = response.data.countries;
});
});
HTML code:
<body ng-app="myApp">
<div ng-controller="MyController">
<ul>
<li ng-repeat="(key, value) in items" {{key}}>
</li>
</ul>
</div>
</body>
Here is my plunker. What am I doing wrong here?
Solution
There are three issues,
(i)You do not need to declare the module twice , once in script.js and other one in controller.js.
(ii) You were refering to angular 2.0 version ,and coded using angular 1.4 version.
(iii)If you want to show all states from json, it should not have a duplicate key, which you could see from the plunker itself
{ "countries": { "State": [ "TamilNadu" ], "State": [ <-- Error: duplicate key! "Karnataka" ] } }
Here is the working Application
Answered By - Sajeetharan
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.