angular - 用于行问题的角度 html 表 ngfor

Question

我有这个 Angular 的 html：

<table>
                <thead>
                    <tr>
                        <th *ngFor="let col of columns">
                            {{col}}
                        </th>
                    </tr>
                    <tr>
                        <th *ngFor="let col of subColumns">
                            {{col}}
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let priceRow of priceRows">
                    <td *ngFor="let price of priceRow">
                        {{price}}
                    </td>
                </tr>
                </tbody>    
            </table>

这是我正在尝试执行行的 priceRows 的内容：

但是在尝试打印表格时我得到了空表。

您在 priceRows 的数组中看到任何错误吗？

Stackblitz 网址：https ://angular-bnxfca.stackblitz.io

Answer 1

通过 * ngIf (columns && subColumns && priceRows && priceRow) 添加验证到标签表。

<table *ngIf="colums && subcolums...">

并验证模板上的日期

{{columns|json}}
{{subColumns |json}}

如果模板加载时存在数据，一切都会好起来的

Answer 2

TS：

priceRows: any[] = [];

试试这个：

<table>
    <thead>
        <tr>
            <th *ngFor="let col of columns">
                {{col}}
            </th>
        </tr>
        <tr>
            <th *ngFor="let col of subColumns">
                {{col}}
            </th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="let price of priceRows">
            <td *ngFor="let item of price">
                {{item}}
            </td>
        </tr>
    </tbody>
</table>

工作 Stackbiltz 演示