角度2的材料设计< mat-expansion-panel>全部展开全部折叠 [英] Angular 2 material design <mat-expansion-panel> expand all / collapse all

问题描述

我想用角2材质实现全部展开和全部折叠.任何人都可以提出想法吗?该怎么做?

I wanted to implement expand all and collapse all in angular 2 material. Can any one give idea? how to do that?

推荐答案

1-您应该删除mat-accordion以启用多个扩展面板.

1- You should remove the mat-accordion to enable multiple expanded panels.

2-使用expanded参数同时更改多个状态.

2- Use the expanded parameter to change multiple states at the same time.

这是一个正在运行的示例.

编辑

从版本 6.0.0-beta- 0 ，则可以使用multi参数以及openAll和closeAll函数:

From version 6.0.0-beta-0 you can use multi parameter and the openAll and closeAll functions :

1-更改mat-accordion元素以将muti设置为true并获取MatAccordionComponent实例:

1- Change the mat-accordion element to set the muti to true and get the MatAccordionComponent instance :

<mat-accordion #accordion="matAccordion" [multi]="true">

2-然后使用openAll和closeAll功能打开或关闭所有面板:

2- Then use the openAll and closeAll functions to open or close all panels :

<button (click)="accordion.openAll()">Expand All </button>
<button (click)="accordion.closeAll()">Collapse All </button>

这是一个正在运行的示例.

这篇关于角度2的材料设计< mat-expansion-panel>全部展开全部折叠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！