angular - 使用 Angular 材质表对列进行分组
解决方案
您可以在列组中添加一个<tr>
,并使用它[attr.colspan]
来指定要包含的列数。下面的示例有 4 列。
<!-- Header row first group -->
<ng-container matColumnDef="header-row-first-group">
<th mat-header-cell *matHeaderCellDef
[style.text-align]="center"
[attr.colspan]="1">
First group
</th>
</ng-container>
<!-- Header row second group -->
<ng-container matColumnDef="header-row-second-group">
<th mat-header-cell *matHeaderCellDef [attr.colspan]="3"> Second group </th>
</ng-container>
<tr mat-header-row *matHeaderRowDef="['header-row-first-group', 'header-row-second-group']"></tr>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
我在这个Github 问题的线程中找到了解决方案。
有关完整的工作示例,请参阅此Stackblitz。
推荐阅读
- r - 在 R 中使用样条和交互的模型的池系数
- javascript - 在调用更新它的函数之前反应状态更新
- javascript - 如何在使用 Django 后端提交 HTML 表单时重定向到 vanilla JavaScript 中的另一个页面?
- wordpress - Wordpress wpdatatables 正在复制内容的路径
- python - Python无法找到外部依赖的dll
- gsutil - 如何为同一个谷歌云存储桶中的所有文件循环 gsutil 命令?
- docker - 如何在 Docker 中共享挂载?
- java - 是否有工具可以将使用 io.swagger 1.5.x 注释的 Java 代码迁移到 io.swagger 2.x 注释?
- google-sheets - BY 列未引入谷歌表格查询
- r - R bootstrapping - 't' 返回 NA 值