如何在没有html元素的情况下使用ng-repeat

Question

我需要使用ng-repeat（在AngularJS中）列出数组中的所有元素。

复杂的是，数组的每个元素都将转换为表的一，两或三行。

我不能创建有效的html（如果ng-repeat用于元素上），因为<tbody>和之间不允许使用任何类型的重复元素<tr>。

例如，如果在上使用ng-repeat <span>，我将得到：

<table>
  <tbody>
    <span>
      <tr>...</tr>
    </span>
    <span>
      <tr>...</tr>
      <tr>...</tr>
      <tr>...</tr>
    </span>
    <span>
      <tr>...</tr>
      <tr>...</tr>
    </span>
  </tbody>
</table>

无效的html。

但是我需要生成的是：

<table>
  <tbody>
    <tr>...</tr>
    <tr>...</tr>
    <tr>...</tr>
    <tr>...</tr>
    <tr>...</tr>
    <tr>...</tr>
  </tbody>
</table>

其中第一行由第一个数组元素生成，接下来的三行由第二个数组生成，第五行和第六个由最后一个数组元素生成。

如何使用ng-repeat，使其绑定的html元素在渲染过程中“消失”？

还是对此有另一种解决方案？

澄清：生成的结构应如下所示。每个数组元素可以生成表的1-3行之间。理想情况下，答案应支持每个数组元素0-n行。

<table>
  <tbody>
    <!-- array element 0 -->
    <tr>
      <td>One row item</td>
    </tr>
    <!-- array element 1 -->
    <tr>
      <td>Three row item</td>
    </tr>
    <tr>
      <td>Some product details</td>
    </tr>
    <tr>
      <td>Customer ratings</td>
    </tr>
    <!-- array element 2 -->
    <tr>
      <td>Two row item</td>
    </tr>
    <tr>
      <td>Full description</td>
    </tr>
  </tbody>
</table>

Answer 1

更新： 如果您使用的是Angular 1.2+，请使用ng-repeat-
start
。请参阅@jmagnusson的答案。

否则，如何将ng-repeat放在身上？（AFAIK，可以在单个表中包含多个。）

<tbody ng-repeat="row in array">
  <tr ng-repeat="item in row">
     <td>{{item}}</td>
  </tr>
</tbody>