html – ngFor创建2行

使用 Angular 2 ngFor我正在创建一个表.

我的问题是我的数据数组包含的元素使得每个元素应该在表中创建2个连续的行(使用不同的字段,第二行可以与更多数据折叠)

<tbody>
    <tr *ngFor="let element of data; let i = index">
       <th>...<th>
       ...
       <td>...<td>
    </tr>
</tbody>

问题是tbody不允许< tr>旁边的任何属性.

我正在寻找类似的东西

<tbody>
   <template *ngFor="let element of data; let i = index">
       <tr>...</tr> //row 1
       <tr>...</tr> //row 2
   </template>
</tbody>

解决方法

存在略有不同的语法：

<template ngFor let-element [ngForOf]="data" let-i="index">
   <tr>...</tr> //row 1
   <tr>...</tr> //row 2
</template>

要么

<ng-container *ngFor="let element of data let i=index">
   <tr>...</tr> //row 1
   <tr>...</tr> //row 2
</ng-container>

更新> = 4.0.0<模板>更改为< ng-template>

<ng-template ngFor let-element [ngForOf]="data" let-i="index">
   <tr>...</tr> //row 1
   <tr>...</tr> //row 2
</ng-template>

原文地址：https://www.jb51.cc/html/231691.html