显示带有数组子列的标题表 Angular

headerRows = [
        {
            id: 1,
            column: 'A',
            col1: 1,
            col2: 2,
        },
        {
            id: 2,
            column: 'B',
            col1: 1,
            col2: 2,
        },
        {
            id: 3,
            column: 'C',
            col1: 1,
            col2: 2,
        },
    ];

<table>
        <thead class="thead">
            <tr>
                <th class="text" rowspan = '2'>Text</th>
                <th *ngFor="let headerCell of headerRows" colspan = 2>{{headerCell.column}}</th>
            </tr>
            <tr>
                    <td *ngFor="let cell of headerRows">{{cell.col1}} </td>
                    <th *ngFor="let cell of headerRows">{{cell.col2}}</th>
            </tr>
        </thead>
</table>

    <thead class="thead">
        <tr>
            <th class="text" rowspan = '2'>Text</th>
            <th *ngFor="let headerCell of headerRows" colspan = 2>{{headerCell.column}}</th>
        </tr>
        <tr>
          <ng-container *ngFor="let cell of headerRows">
            <td>{{cell.col1}} </td>
            <th>{{cell.col2}}</th>
          </ng-container>
        </tr>
    </thead>

Angular相关问答推荐

如何用Effect()识别正确的Angular 信号？

如何在HTML外部项目中使用Web组件(以17角创建)

Angular 17不接受带点(.)的路径在开发环境中，它直接抛出一个404错误

Angular 16+使用ngTemplateOutlet有条件地呈现几个模板中的一个

如何防止变量值重置？

RXJS拆分返回值，多次调用后重新加入

如何捕获生命周期方法中抛出的Angular组件错误？

我的验证器收到一个始终为空的可观察值

NGX-Translate如何不得到404？

Cypress 12.8.1 无法使用条纹元素 iframe

Chart.js 如何编辑标题标签 colored颜色

as和let之间的异步管道区别

根据变量值更改按钮样式

Angular2订阅对子组件中@Input的更改

在Angular 6 中找不到 HammerJS

找不到模块angular2/core

Angular2中是否有像window.onbeforeunload这样的生命周期钩子？

如何在 Angular 2 中动态添加和删除表单字段

Hot and Cold observables：有 hot和 cold运算符吗？

在angular-cli中创建模块时生成路由模块