CODEWITHSUNDEEP
htmlcssangularangular-material
bensalerno
bensalerno

Reputation: 534

How to only allow one mat-expansion-panel to be open at a time?

I have several mat-extension-panels on my project. As expected, when I click them, they open and stay open until they are clicked shut. I would like it so that only one of the panels can be open at a time. That is, if a panel is already open when another is clicked, it should close the open panel and open the new one. Is this possible to do in Angular? How can I go about this modification?

Upvotes: 0

Views: 3997

Answers (1)

Luis Reinoso
Luis Reinoso

Reputation: 758

According with docs you should wrap them with mat-accordion

<mat-accordion>
  <mat-expansion-panel>
  </mat-expansion-panel>

  <mat-expansion-panel>
  </mat-expansion-panel>
</mat-accordion>

Upvotes: 5

Related Questions