Question

鉴于以下模型：

[{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指令呢？

Answer 1

嵌套重复和新的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

angularjs table：tr with category with ng-repeat with list

1 个答案: