Currently my side navigation bar only sizes to fit the activated link, instead of showing all the links. Is there a way to fix it so that it shows all the links fully all the time?


<mat-sidenav-container class="example-container">
<mat-sidenav #sidenav mode="side" [(opened)]="opened">
<div class="d-flex flex-column flex-shrink-0 p-3 bg-light" style="width: 280px;">
<ul ngbNav #nav="ngbNav" [(activeId)]="active" class="nav-pills" orientation="vertical">
<li *ngFor="let link of links" ngbNavItem="{{ link.name }}">
<a ngbNavLink routerLink='{{ link.link }}'>{{ link.name }}</a>
</li>
</ul>
</div>
</mat-sidenav>
<mat-sidenav-content>
<p><button type="button" class="btn btn-primary" (click)="sidenav.toggle()">sidenav.toggle()</button></p>
<router-outlet></router-outlet>
</mat-sidenav-content>
</mat-sidenav-container>