Question

我有一个包含{"id":1,"name":"name1"}的JSON对象，我从rest api获取，我想使用ng-repeat在列表中显示name属性。以下是我在页面中的内容：

 <ion-item ng-repeat="p in Names">
        {{p.name}}
 </ion-item>

上述代码不会显示任何内容，当我将{{ p.name }}更改为{{ Names }}时，会显示{"id":1,"name":"name1"}。迭代并获得每个属性？

Answer 1

您的JSON对象是数组是这样还是对象？

/* Array - Can ng-repeat on this */
Names = [{"id":1, "name":"name1"}]

/* Object - Cannot ng-repeat on this */
Names = {"id":1, "name":"name1"}

如果它只是对象，ng-repeat将无法进行迭代。

您可以在行动here中看到此示例。

从user3514822回答以下问题

如果下面的注释中JSON.parse可以返回一个对象数组或只返回一个对象。

var response = { "userlist": [ "{\"id\":1,\"name\":\"alex\"}" ] };

$scope.Names=JSON.parse( response.userlist );

if( Object.prototype.toString.call( $scope.Names ) !== '[object Array]' ) {
    $scope.Names = [ $scope.Names ];
}

执行此操作后，ng-repeat应该可以正常工作，因为$scope.Names应该始终是一个数组。

Answer 2

尝试

{{Names.name}}

你可以遍历一个对象数组，但如果你只有一个对象，则没有必要。如果你有类似的东西，你需要迭代：

Names = [{"id":1,"name":"name1"}, {"id":2,"name":"name2"}, {"id":3,"name":"name3"}, ...]

在这种情况下，通过执行{{p.name}}，ng-repeat =“名称中的p”可以正常工作。

希望有所帮助

Answer 3

ng-repeat用于列表（重复的事情），如：

Names = [{"id":1,"name":"name1"}, {"id":2,"name":"name2"}, {"id":3,"name":"name3"}]

如果你只有 {＆＃34; id＆＃34;：1，＆＃34; name＆＃34;：＆＃34; name1＆＃34;} 摆脱ng-repeat只需使用 {{Names.name}}

<ion-content ng-controller="testPage">
   <ion-list>                                           
     <ion-item>
            {{Names.name}}
     </ion-item> 
  </ion-list>
</ion-content>

如果要覆盖这两种情况，只需创建一个数组。（当名称只是一个对象时。

Names = angular.isObject(Names)?[Names]:Names;

在ng-repeat

3 个答案: