【问题标题】:angularjs table : tr with category using ng-repeat with listangularjs 表:使用 ng-repeat 和列表的类别 tr
【发布时间】:2014-02-03 17:49:26
【问题描述】:

给定以下模型:

[{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 指令来做到这一点?

【问题讨论】:

    标签: javascript angularjs html-table angularjs-ng-repeat


    【解决方案1】:

    嵌套重复和新的 ng-repeat-start/ng-repeat-end 和记住 &lt;table&gt; 可以有多个身体和头部:

    <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

    【讨论】:

    • 太棒了,不知道 ng-repeat-start/end 语句。
    猜你喜欢
    • 2013-11-23
    • 2013-01-10
    • 1970-01-01
    • 2023-04-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-03-08
    • 2014-10-12
    相关资源
    最近更新 更多