在单个ng-repeat中创建多个td

时间:2015-02-27 05:30:26

标签: javascript html angularjs

构建表格时遇到问题。

目前我的代码如下:

<tr ng-repeat="...">
    <td>Some tds before</td>
    <td ng-repeat="foo in allFoo()">
        {{foo.v1}} ({{foo.v2}})
    </td>
    <td>Some tds after</td>
</tr>

我真正需要的是在这里建立两列。以某种方式将元素的内部ng-repeat移动到外部。类似的东西:

<tr ng-repeat="...">
    <td>Some tds before</td>
    <foobar ng-repeat="foo in allFoo()">
       <td>{{foo.v1}}</td>
       <td>{{foo.v2}}</td>
    </foobar>
        <td>Some tds after</td>
</tr>

我该怎么做?

2 个答案:

答案 0 :(得分:7)

试试这个..

<tr ng-repeat="...">
    <td>Some tds before</td>
    <td ng-repeat-start="foo in allFoo()">{{foo.v1}}</td>
    <td ng-repeat-end>{{foo.v2}}</td>
    <td>Some tds after</td>
</tr>

https://docs.angularjs.org/api/ng/directive/ngRepeat

了解有关ng-repeat-startng-repeat-end的详情

答案 1 :(得分:0)

使用<table>中的<tr>构建两列

<tr ng-repeat="...">
 <td>Some tds before</td>
  <table>
   <tr>
    <th>Foo V1</th>
    <th>Foo v2</th>
   </tr>
   <tr ng-repeat="foo in allFoo()">
    <td>{{ foo.v1 }}</td>
    <td>{{ foo.v2 }}</td>
   </tr>
  </table>
 <td>Some tds after</td>
</tr>