如何在Angular Material中创建带有md-sidenav的右侧Navbar - Angular 2

Question

我正在尝试使用角度材料2创建"右侧导航栏" md-sidenav.无论我做什么,它总是在左边.我怎样才能改为右侧呢？

  <md-sidenav #sidenavright mode="side" class="app-sidenav" opened="true">
    <app-question-rightnav></app-question-rightnav>
  </md-sidenav>

Answer 1

好吧,它比我想象的容易,傻我!

要将md-sidenav对齐到右侧,只需添加align="end"到md-sidenav元素.

  <md-sidenav align="end" #sidenavright mode="side" class="app-sidenav" opened="true">
    <app-question-rightnav></app-question-rightnav>
  </md-sidenav>

更新

它已position="end"在以后的版本中更改为

例

<mat-sidenav #sidenavright position="end">
       Right sideNav
</mat-sidenav>

Answer 2

<mat-sidenav-container>

    <mat-sidenav #right position="start">
       Start Sidenav.
    </mat-sidenav>

    <mat-sidenav #left position="end">
       End Sidenav.
    </mat-sidenav>

<div>
    <button mat-button (click)="right.open()">right</button>
    <button mat-button (click)="left.open()">left</button>
</div>

</mat-sidenav-container>