AngularJS循环内部数组

时间:2014-04-16 16:28:57

标签: angularjs

我试图在作为API GET调用的结果集返回的数组中循环,但似乎无法找到如何执行此操作的方法。有人可以帮我一个关于如何循环这个数组以在应用程序视图上显示它的示例吗?感谢

以下是返回的结果集格式:

Object {Result: Array[5]}
Result: Array[5]
0: Object
  id: 1
  name: "Mark"
1: Object
2: Object
3: Object
4: Object
5: Object
length: 5
__proto__: Array[0]
__proto__: Object

注意: - 我已经尝试过使用ng-repeat但无法在我的视图中显示数据。要在我的视图中显示数据,我必须这样做

    <tbody ng-repeat="client in my clients">      
        <tr>
          <td>
           1
          </td>
          <td>
            {{client.0.name}}
          </td>
        </tr>
      </tbody>

正如你所看到的,我在这里静态写0来获取第一条记录,而我需要从0循环到最大长度。无论如何我可以用ng-repeat

来做到这一点

2 个答案:

答案 0 :(得分:3)

我根据此模型创建了fiddle

$scope.Object = {
    Result: [        
    {id: 1, name: "Mark 1"},        
    {id: 2, name: "Mark 2"},        
    {id: 3, name: "Mark 3"},        
    {id: 4, name: "Mark 4"},
]};

我正在这样循环:

<table>
    <tbody>
        <tr ng-repeat="client in Object.Result">
            <td>{{client.id}}</td>
            <td>{{client.name}}</td>
        </tr>
    </tbody>
</table>

答案 1 :(得分:2)

ng-repeat是用于循环遍历数组并在视图中显示它们的标准实用程序,如果您需要更多高级功能,则应该查看ng-grid或其他数据网格:

<div ng-repeat="result in results">
   <h2>{{result.id}}</h2>
   <h4>{{result.name}}</h4>
</div>

在此之前,您需要将结果(API调用的结果)导入控制器$scope

app.controller("someController",function($scope,someService){
  someService.getData().success(function(data){
    $scope.results=data.Result;
  })
});

编辑:

Here's a working plunk,随时修改它,向我们展示为什么ng-repeat不适合你。