json數組與angularjs不與ng-repeat指令工作

我無法顯示json在html中的所有對象，我只獲得json數組格式，但當我更改url時，我可以顯示每個對象。我想在html中顯示所有json對象。json數組與angularjs不與ng-repeat指令工作

第一例

var MyApp = angular.module('MyApp', []); 
 

 
MyApp.controller('MyPerson', function($scope, $http) { 
 
    $http.get("http://127.0.0.1:8000/people/person/?format=json"). 
 
     success(function(data) { 
 
      $scope.person = data; 
 
     }); 
 
     }); 
 

 

 

 
{% verbatim %} 
 
<body> 
 

 

 
<div ng-app="MyApp"> 
 
<div ng-controller="MyPerson"> 
 

 
<div> 
 

 

 
{{person}} 
 

 
</div> 
 
</div> 
 
</div> 
 

 
</body> 
 
{% endverbatim %} 
 

 

 

 
{"meta":{"limit":20,"next":null,"offset":0,"previous":null,"total_count":3},"objects":[{"city":"Budapest","id":1,"name":"Igor","resource_uri":"/people/job/person/1/","slug":"person"},{"city":"Warszawa","id":2,"name":"Karol","resource_uri":"/people/job/person/2/","slug":"person1"},{"city":"Jerozolima","id":3,"name":"Michal","resource_uri":"/people/job/person/3/","slug":"Ima"}]}

因此，在第一個例子中我得到JSON的所有對象，但只能以JSON格式

第二個例子

var MyApp = angular.module('MyApp', []); 
 

 
MyApp.controller('MyPerson', function($scope, $http) { 
 
    $http.get("http://127.0.0.1:8000/people/person/1/?format=json"). 
 
     success(function(data) { 
 
      $scope.person = data; 
 
     }); 
 
     }); 
 

 

 

 

 
{% verbatim %} 
 
<body> 
 

 

 
<div ng-app="MyApp"> 
 
<div ng-controller="MyPerson"> 
 

 
<div> 
 

 

 
{{person.name}} 
 
    {{person.city}} 
 
    {{person.id}} 
 

 
</div> 
 
</div> 
 
</div> 
 

 
</body> 
 
{% endverbatim %} 
 

 

 

 
Igor Budapest 1

在第二個示例中，我更改url我鍵入1，這是我的對象的id，然後更改我的模板我得到json文件的html格式，我想要的。

第三個例子

var MyApp = angular.module('MyApp', []); 
 

 
MyApp.controller('MyPerson', function($scope, $http) { 
 
    $http.get("http://127.0.0.1:8000/people/person/?format=json"). 
 
     success(function(data) { 
 
      $scope.persons = data; 
 
     }); 
 
     }); 
 

 

 
{% verbatim %} 
 
<body> 
 

 

 
<div ng-app="MyApp"> 
 
<div ng-controller="MyPerson"> 
 

 
<div ng-repeat="person in persons"> 
 

 

 
<p>{{person.name}}</p> 
 
<p>{{person.city}}</p> 
 
    <p>{{person.id}}</p> 
 

 
</div> 
 
</div> 
 
</div> 
 

 
</body> 
 
{% endverbatim %}

在第三個例子，我應該得到的所有對象，但我的HTML是明確的，空的。

我嘗試了一切，我認爲我做的一切都在模板中，mayby問題出在控制器中，我應該輸入不同的url到jonson？

來源

2014-12-11 IOR88

我想你想'$ scope.persons = data.objects' – haxxxton 2014-12-11 02:35:46

這是因爲你的網址「/人/人/？格式= json的」返回以下對象

{"meta":{"limit":20,"next":null,"offset":0,"previous":null,"total_count":3}, 
"objects":[{"city":"Budapest","id":1,"name":"Igor","resource_uri":"/people/job/person/1/","slug":"person"},{"city":"Warszawa","id":2,"name":"Karol","resource_uri":"/people/job/person/2/","slug":"person1"},{"city":"Jerozolima","id":3,"name":"Michal","resource_uri":"/people/job/person/3/","slug":"Ima"}]}

這個對象有只有兩個鍵「元」和「對象」。所以當你在ng-repeat中使用這個對象時，它不能找到person.name，person.city和person.id，因爲它第一次將拾取「meta」對象，並且下一次「objects」對象不會有姓名，城市或身份證。

爲了解決這個問題，改變get方法的成功功能data.objects分配給$ scope.persons

MyApp.controller('MyPerson', function($scope, $http) { 
$http.get("http://127.0.0.1:8000/people/person/?format=json"). 
     success(function(data) { 
      $scope.persons = data.objects; 
     }); 
     });

來源

2014-12-11 07:20:36

感謝您的幫助; ） – IOR88 2014-12-11 07:40:42

絕對沒問題:) – 2014-12-11 07:45:26

json數組與angularjs不與ng-repeat指令工作

回答

相關問題