mat-table Angular 中的动态 matHeaderRowDef

Question

我即将动态绑定

mat-table

中的组标题行。但是

DOM

找不到headerId。

HTML：

<ng-container *ngFor="let result of headerData; let i = index">

                <ng-container [matColumnDef]="header-row-'+i+'-group">

                    <th mat-header-cell *matHeaderRowDef

                        [style.text-align]="center"

                        [attr.colspan]=result.Count>

                        {{result.Name}}

                    </th>

                </ng-container>

</ng-container>

<tr mat-header-row *matHeaderRowDef="groupHeaderColumns"></tr>

<tr mat-header-row *matHeaderRowDef="columnNames"></tr>

打字稿：

this.groupHeaderColumns = ['header-row-1-group', 'header-row-2-group']

试过了，

1. headerRow 作为“header-row-1-group”静态但仍然是相同的错误
2. 替换了 Div 而不是 ng-container

错误：

Couldnot find the header with id header-row-1-group

我哪里错了，我应该做什么改变？

Answer 1

尝试以下更改，您需要连接字符串

<ng-container [matColumnDef]="'header-row-'+i+'-group'">