如何显示ng-repeat嵌套值

时间:2016-08-18 20:59:54

标签: angularjs

我有以下对象。我怎样才能显示具有嵌套值的行?

$scope.mainObj = [{
    name: 'a', items : [1,2,3],
    name: 'b', items : [4,5,6],
}]

<table>
 <tr ng-repeat="obj in mainObj">
        <td></td>
 </tr>
</table>

我希望我的输出为:

<table>
   <tr>
      <td>1</td>
  </tr>
   <tr>
      <td>2</td>
   </tr>
   <tr>
      <td>3</td>
   </tr>
   <tr>
      <td>4</td>
   </tr>
</table>

2 个答案:

答案 0 :(得分:3)

您可以重复tbody table这是有效的HTML。 假设items可以拥有实体。

<强> HTML

<table>
  <tbody ng-repeat="obj in mainObj">
     <tr ng-repeat="item in obj.items">
        <td>{{item }}</td>
      </tr>
  </tbody>
</table>

<强>更新

更正您的对象结构以及评论中建议的@csschapker。

$scope.mainObj = [{name: 'a', items:[1, 2, 3]}, {name: 'b', items: [4, 5, 6]}]

答案 1 :(得分:0)

使用这样的代码:

<table>
 <tr ng-repeat="obj in mainObj">
   <td ng-repeat="item in obj.items track by $index">
     {{item}}
   </td>
 </tr>
</table>

将源对象编辑为:

$scope.mainObj = [
  {name: 'a', items: [1, 2, 3]},
  {name: 'b', items: [4, 5, 6]}
];