我正在使用 Angular Mat-Table 并创建了一个带有可扩展行的表格，就像下面 Angular 8 中的表格一样：
https://stackblitz.com/angular/qykjaloknex?file=app%2Ftable-expandable-rows-example.ts
我想知道是否有一种方法可以创建一个展开所有按钮，该按钮将一次展开每一行，而不必一次单击每一行来展开它。
谢谢！
您可以通过引入一个属性来实现这一点，除了expandedElement.
在模板中添加一个按钮来切换全部展开/折叠：
<button mat-raised-button (click)="toggle()">{{allRowsExpanded ? 'Collapse' : 'Expand'}}</button>
更改要展开的行的条件：
<div class="example-element-detail"
[@detailExpand]="(element == expandedElement || allRowsExpanded) ? 'expanded' : 'collapsed'">
并将其连接到组件中：
allRowsExpanded: boolean = false;
public toggle() {
this.allRowsExpanded = !this.allRowsExpanded;
this.expandedElement = null;
}
看看这个stackblitz 的工作示例。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句