CODEWITHSUNDEEP
jsonangularjs
Branka
Branka

Reputation: 125

how to display data from json with ng-repeat

So i loaded the json and now i cant display it and it says not well-formed. But i'm not really sure what to write in html.

here is my js:

app.controller('jsonController', function($scope, $http) {
    $http.get('podaci.json').success(function(data) {
        $scope.gradovi = data;
    });
});

and html:

<div ng-controller = "jsonController">
   <ol>
      <li ng-repeat="gradovi in ponudjene">
         {{gradovi.ponudjene}}
      </li>
   </ol>
</div>

and this is json:

{
   "ponudjene": [
      "Ada",
      "Adaševci",
      "Žitni Potok",
      "Žitorađa",
      "Zlatibor",
      "Zlatica",
      "Zlodol",
      "Zlot",
      "Zmajevo",
      "Zminjak",
      "Zrenjanin",
      "Zubin Potok",
      "Žuč",
      "Zuce",
      "Zvečan",
      "Zvezdan",
      "Zvonce",
      "Đala",
      "Đunis",
      "Đurđevo",
      "Đurđin"
   ],
   "tacno": [
      "Zvezdan",
      "Zvezdan",
      "Bor",
      "Rudna Glava",
      "Majdanpek"
   ],
   "vreme": 100,
   "oblast": "Istocna srbija"
}

Upvotes: 3

Views: 2889

Answers (3)

Branka
Branka

Reputation: 125

Found it!Thank u all for help! :) 

<ol>
<li ng-repeat="item in gradovi.ponudjene track by $index">
 {{item}}
</li>
</ol>

Upvotes: 0

Anik Islam Abhi
Anik Islam Abhi

Reputation: 25352

Try like this 

<ol>
   <li ng-repeat="item in gradovi.ponudjene">
      {{item}}
   </li>
   <li ng-repeat="item in gradovi.tacno">
      {{item}}
   </li>
   <li>
      {{gradovi.vreme}}
   </li>
   <li>
      {{gradovi.oblast}}
   </li>
</ol>

Upvotes: 2

Johnny
Johnny

Reputation: 1143

Not sure what your json data looks like, but your $scope is "gradovi", so your li should look something like this:

<li ng-repeat="item in gradovi">
     {{item.name_of_field_in_your_json}}
</li>

UPDATE:

Now that I see your json data. Here is the fiddle:

http://jsfiddle.net/RkykR/778/

Upvotes: 0

Related Questions