Question

我正在尝试为动态列启用多选选项。尽管动态列有效，但多选功能不起作用。

致谢

jcm

<mat-table [dataSource]="dataSource" matSort="matSort">
        <ng-container [matColumnDef]="col.columnDef" *ngFor=" let col of displayColumns">
            <th mat-header-cell *matHeaderCellDef mat-sort-header>
                {{ col.header }}
                <ng-container [matColumnDef]="select">
                    <th mat-header-cell *matHeaderCellDef>
                        <mat-checkbox #checkbox (change)="$event ? masterToggle() : null" [disabled]="isDisabled" [checked]="selectionTable.hasValue() && isAllSelected()"
                            [indeterminate]="selectionTable.hasValue() &&
                                                                              !isAllSelected()"></mat-checkbox>
                    </th>
                </ng-container>
            </th>
            <td mat-cell *matCellDef="let element ">{{ element[col.columnDef] }}</td>
            <td mat-cell *matCellDef="let row">
                <mat-checkbox (click)="$event.stopPropagation()" (change)="$event ? selectionTable.toggle(row) : null" [checked]="selectionTable.isSelected(row)"></mat-checkbox>
            </td>
        </ng-container>
        <tr mat-header-row *matHeaderRowDef="columnDefs"></tr>
        <tr mat-row *matRowDef="let row; columns: columnDefs; "></tr>
    </mat-table>

Answer 1

您必须在多选列的displayColumns中添加标题，并且在使用*ngFor运行它们时，必须使用*ngIf检查是否在第一个标题（属于多选列）或其他标题（属于动态列），分别创建标题和列。

您可以看到我在stackblitz中所做的一个示例。

如何启用具有多选和动态列的mat-table

1 个答案: