2014-01-15 19 views
1

考虑以下模型:angularjs表:保留时间与类别使用NG-重复使用列表

[{categoryName: "category1", items:[{name:"item1.1"}{name:"item1.2"},...]}, 
{categoryName: "category2", items:[{name:"item2.1"},...]},...] 

我想创建该表:

<table> 
    <tr> 
    <th>category1</th> 
    </tr> 
    <tr> 
    <td>item1.1</td> 
    </tr> 
    <tr> 
    <td>item1.2</td> 
    </tr> 
    ... 
    <tr> 
    <th>category2</th> 
    </tr> 
    <tr> 
    <td>item2.1</td> 
    </tr> 
    ... 
</table> 

使用angularjs它你会怎么办说明?

回答

7

嵌套的重复和新ng-repeat-start/ng-repeat-end记住,这是确定的<table>有许多机构和负责人:

<table> 
    <thead ng-repeat-start="x in data"> 
     <tr><th>{{x.categoryName}}</th></tr> 
    </thead> 
    <tbody ng-repeat-end> 
     <tr ng-repeat="y in x.items"> 
      <td>{{y.name}}</td> 
     </tr> 
    </tbody> 
</table> 

相关小提琴:http://jsfiddle.net/kGZt8/

文档:ngRepeat

+0

真棒,不知道ng-repeat-start/end语句。 – Quentin

+0

真棒回答! –