如何在 Angular Material - Angular 2 中使用 md-sidenav 创建右侧导航栏
How to create Right side Navbar with md-sidenav in Angular Material - Angular 2
我正在尝试用 angular material 2 md-sidenav
创建 "right navbar"。不管我做什么,它总是从左边来。我怎样才能将其更改为右侧 sidenav?
<md-sidenav #sidenavright mode="side" class="app-sidenav" opened="true">
<app-question-rightnav></app-question-rightnav>
</md-sidenav>
好吧,这比我想象的要容易,傻我!!
要将 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>
<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>
我正在尝试用 angular material 2 md-sidenav
创建 "right navbar"。不管我做什么,它总是从左边来。我怎样才能将其更改为右侧 sidenav?
<md-sidenav #sidenavright mode="side" class="app-sidenav" opened="true">
<app-question-rightnav></app-question-rightnav>
</md-sidenav>
好吧,这比我想象的要容易,傻我!!
要将 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>
<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>