Angular JS中未加载JSON数据

Question

I am new to AngularJS & JSON and giving a try on below example, but I am unable to load the data from JSON file: 我是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 data.json

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

I am able to see Name and Roll no but not the percentage.num and percentage.avrg. 我能够看到“名称和卷号”，但看不到percent.num和percent.avrg。 Any thing that I am missing ? 我有什么想念的吗？

Answer 1

percentage is modeled as an array. 百分比建模为数组。 Either use an Object or you have to access it on another way like 使用对象，或者您必须以其他方式访问它，例如

 percantage[0].num

but i think i would structure the json like: 但我认为我会像这样构造json：

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

not tested, but in my opinion the combination of array AND objects always makes problems... 未经测试，但在我看来，数组和对象的组合总是会产生问题...

Answer 2

Here is a working plunker 这是一个工作的家伙

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

you have two options use percentage[0] like {{ kitty.Percentage[0].num}} 您有两个使用百分比[0]的选项，例如{{ kitty.Percentage[0].num}}

or change your Json to "Percentage" : {"num" : 88, "avrg": 4 } 或将您的Json更改为“ Percentage”：{“ num”：88，“ avrg”：4}

Angular JS中未加载JSON数据

问题描述

2 个解决方案

解决方案1
2 2015-06-26 13:31:25

解决方案2
1 已采纳 2015-06-26 13:32:07

Angular JS中未加载JSON数据

问题描述

2 个解决方案

解决方案1 2 2015-06-26 13:31:25

解决方案2 1 已采纳 2015-06-26 13:32:07

解决方案1
2 2015-06-26 13:31:25

解决方案2
1 已采纳 2015-06-26 13:32:07