How to expand all mat-expansion-panel with complex array by click a button?-CodePudding

I am trying to display Mat-expansion-panel by click "open all" button. Now, i face the problem is inner panel is not working. It only can open the outside only. I would like to open all panel with inner panel. How to achieve it ? Please help. stackblitz link

CodePudding user response：

You are trying to expand expansion panels, but you are selecting accordion, this is the problem with your code, what you can do is use viewchildren , select all expansion panels, and then open them when you want. here is how the code will look like

  @ViewChildren(MatExpansionPanel) panels: QueryList<MatExpansionPanel>;


openAll(){
this.panels.forEach(panel => panel.open();)}

CodePudding user response：

Get all expansion panel instance using ViewChildren decorator

@ViewChildren(MatExpansionPanel) expansionPanel: QueryList<MatExpansionPanel>;

Then call open method on it when you click openAll button

openll() {
    this.expansionPanel.toArray().forEach((panel)=>{
      panel.open();
    })
}

Forked Working Example