我正在尝试添加一个类似于mat-accordion的扩展面板（可能是一个新组件），以便在点击时显示mat-table行内的详细视图 . 我附上了一个用来证明要求的掠夺者 . http://plnkr.co/edit/mBGT3D1JV5rXXRiEwCAc?p=info
这是我试图添加扩展列的演示角度材质表，我在html数据表上添加了plunker
<mat-table #table [dataSource]="dataSource">
<!-- Position Column -->
<ng-container matColumnDef="position">
<mat-header-cell *matHeaderCellDef> No. </mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.position}} </mat-cell>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="name">
<mat-header-cell *matHeaderCellDef> Name </mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.name}} </mat-cell>
</ng-container>
<!-- Weight Column -->
<ng-container matColumnDef="weight">
<mat-header-cell *matHeaderCellDef> Weight </mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.weight}} </mat-cell>
</ng-container>
<!-- Symbol Column -->
<ng-container matColumnDef="symbol">
<mat-header-cell *matHeaderCellDef> Symbol </mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.symbol}} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
1 回答
更新：https://stackblitz.com/angular/keapqmllkjp?file=app%2Ftable-expandable-rows-example.ts
旧方法：找到我正在寻找的答案，即使这种方法不是最好的方法，但它仍然可以完成工作 . 任何其他方法表示赞赏 . https://stackblitz.com/edit/angular-material2-expandable-rows-example-rc1-2uowvz?file=app%2Ftable-basic-example.ts