How can I set Angular 6 Material sidenav to open right to left from the right side of the screen
If you look to the API tab there is an input directive position for you to define.
position: 'start' | 'end'The side that the drawer is attached to.
<mat-drawer-container class="example-container"> <mat-drawer #sideNav mode="side" opened="true" position="end"> Right drawer </mat-drawer> <mat-drawer-content> Main content </mat-drawer-content></mat-drawer-container>
You can use input directive position="end" for opening from the right side in mat-drawer.
For instance:
<mat-drawer position="end">
I have tried adding position="end" to make it work but it didn't.
For any lost desperate souls, try adding style.position="absolute" and set your .sidenav to have left: calc(100% - 200px);