I am working on mat-expansion-panel for my sidemenu. I am trying to do the below example:
By default the panel should be closed, but while I click on any of the links and when its routing to other page the panel should be expanded. And when I click on any other panel this respective panel should be closed.
I am facing issue while routing to other pages the panel is getting closed.
Below is the code:
<mat-sidenav #sidemenu class="sidenav sidebar"
[attr.role]="(isHandset$ | async)? 'dialog':'navigation'"
[mode]="(isHandset$ | async)? 'over':'side'"
[opened]="(isHandset$ | async)" >
<mat-nav-list>
<mat-expansion-panel [expanded]="false">
<mat-expansion-panel-header>
<mat-panel-title>
<a routerLink="/user" [routerLinkActive]="['active']"> User</a>
</mat-panel-title>
</mat-expansion-panel-header>
<ul>
<a routerLink="/loginUser" [routerLinkActive]="['active']"> Login </a>
</ul>
<ul>
<a routerLink="/signInUser" [routerLinkActive]="['active']"> Sign In </a>
</ul>
</mat-expansion-panel>
<mat-expansion-panel [expanded]="false">
<mat-expansion-panel-header>
<mat-panel-title>
<a routerLink="/Operator" [routerLinkActive]="['active']"> Operator </a>
</mat-panel-title>
</mat-expansion-panel-header>
<ul>
<a routerLink="/login" [routerLinkActive]="['active']"> Login </a>
</ul>
<ul>
<a routerLink="/signIn" [routerLinkActive]="['active']"> Sign In </a>
</ul>
</mat-expansion-panel>
</mat-nav-list>
</mat-sidenav>