AngularJS ng-repeat数组数组

时间:2015-07-31 14:27:19

标签: javascript arrays angularjs

是否可以将ng-repeat与数组一起使用?

以下是我的观点:

<div ng-repeat="item in items">
  <p>{{item}}</p>
  <ul>
    <li ng-repeat="i in item.items">{{i}}</li>
  </ul>
</div>

这是我的控制器:

  var app = angular.module('plunker', []);
  app.controller('MainCtrl', function($scope) {
    $scope.items = [
      [1, 2, 3],
      [4, 5, 6],
      [7, 8, 9]
    ]
  });

这是我的Plunker:
http://plnkr.co/edit/b6vRVpUKkhPANNVXkkJL?p=preview

我如何输出:

  • 1
  • 2
  • 3


  • 4
  • 5
  • 6


  • 7
  • 8
  • 9

2 个答案:

答案 0 :(得分:14)

你的问题在于这一行:

<li ng-repeat="i in item.items">{{i}}</li>

item.itemsundefined,因为 item是一个数组

您应该枚举item而不是item.items

<body ng-controller="MainCtrl">
  <div ng-repeat="item in items">
    <ul>
      <li ng-repeat="i in item">{{i}}</li>
    </ul>
  </div>
</body>

这是一个有效的Plunk

答案 1 :(得分:4)

你几乎得到了结果。在你的第二个ng-repeat中,这只是一个小错误。

<div ng-repeat="item in items">
  <p>{{item}}</p>
  <ul>
    <li ng-repeat="i in item">{{i}}</li>
  </ul>
</div>

您已经进入了第二个ng-repeat不需要item.items的项目。

有更新的plunker:http://plnkr.co/edit/aLx05WWzFRVrocmXwr12?p=preview