Данные JSON не загружаются в Angular JS

0

Я новичок в AngularJS & JSON и даю пример ниже, но я не могу загрузить данные из файла JSON:

<body>
    <h2>AngularJS Sample Application</h2>
    <div ng-app="" ng-controller="kittyController">
        <table>
            <tr>
                <th>Name</th>
                <th>Roll No</th>
                <th>Percentage</th>
            </tr>
            <tr ng-repeat="kitty in kitties">
                <td>{{ kitty.Name}}</td>
                <td>{{ kitty.RollNo}}</td>
                <td>{{ kitty.Percentage.num}} -- {{kitty.Percentage.avrg}}</td>
            </tr>
        </table>
    </div>
    <script>
        function kittyController($scope, $http) {
            var url = "data.json";
            $http.get(url).success(function(response) {
                $scope.kitties = response;
            });
        }
    </script>

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js">    </script>
  </body>

data.json

[
{
"Name" : "kitty 1",
"RollNo": 101,
"Percentage" : [
{"num" : 88,
  "avrg": 4  }
 ]
 },
 {
 "Name" : "Kitty 2",
 "RollNo": 102,
 "Percentage" : [
  {"num" : 68,
  "avrg": 4  }
 ]
 }
 ]

Я могу видеть Name и Roll no, но не процент.num и percent.avrg. Любая вещь, которую мне не хватает?

2 ответа

1
Лучший ответ

Вот рабочий плункер

http://plnkr.co/edit/Eygjk9AkGrSm7KyGrnKR?p=preview

у вас есть два варианта использования процента [0], например {{ kitty.Percentage[0].num}}

или изменить Json на "Процент": {"num": 88, "avrg": 4}

2

процент моделируется как массив. Либо используйте объект, либо вы должны получить к нему доступ по-другому, как

 percantage[0].num 

но я думаю, что я бы структурировал json как:

{
"Name" : "kitty 1",
"RollNo": 101,
"Percentage" : 
{"num" : 88,
  "avrg": 4  }
 },
 {
 "Name" : "Kitty 2",
 "RollNo": 102,
 "Percentage" :
  {"num" : 68,
  "avrg": 4  }
 }
 ]

не проверены, но, на мой взгляд, сочетание объектов массива AND всегда создает проблемы...

Ещё вопросы

Сообщество Overcoder
Наверх
Меню