I'm trying to create a sidebar for my angular application using functionality from the @angular/material package.
I've tried out multiple ways to add the sidebar to by application but it remains empty/not showing up.
<mat-sidenav-container>
<mat-sidenav #sidenav>
<mat-nav-list>
<a mat-list-item > Accounts </a>
<a mat-list-item > Create Account </a>
<a mat-list-item > Contacts </a>
<a mat-list-item > Create Contact </a>
<a mat-list-item > Activities </a>
<a mat-list-item > Create Activity </a>
<a mat-list-item (click)="sidenav.toggle()" href="" mat-list-item>Close</a>
</mat-nav-list>
</mat-sidenav>
<mat-sidenav-content>
<div style="height: 88vh;">
content
</div>
</mat-sidenav-content>
</mat-sidenav-container>This is the code I'm using in my html template file.
This is the resulting dom:
I have no idea why nothing is there inside the mat-sidenav-container. I'm using angular 9 and created this project with the CLI.
Any help would be appreciated!