Anguar2-Material2:想在工具栏下面设置固定的sidenav

Question

我正在学习angular2和material2.我正在尝试制作具有简单工具栏和固定sidenav的小型网站.我创建了工具栏,但sidenav没有按预期工作.我只是使用下面的plunker代码进行学习.

    <md-toolbar color="primary">
  Angular Material 2 App
</md-toolbar>
<md-sidnav-layout>
  <md-sidenav>
    <md-nav-list>
      <a md-list-item>
            Test1
       </a>

    </md-nav-list>
  </md-sidenav>
</md-sidnav-layout>

Plunker链接

你能帮我创建一个固定的导航栏吗？还是我做错了什么？我正在遵循angular/material2代码.

Answer 1

我想你想要的是:

<md-toolbar color="primary">
    <button md-icon-button (click)="start.toggle()">
        Click
    </button>
    <span>Toolbar</span>
</md-toolbar>

<md-sidenav-container>
    <md-sidenav #start mode="side" opened="true">
        Entry
    </md-sidenav>
    <div class="demo-sidenav-content">
        hey there!
    </div>
</md-sidenav-container>

试试这里:https://plnkr.co/edit/7DyjwRc5ygoyraitGEsv？p =preview

编辑:对于永久打开的sidenav只需使用mode="side" opened="true".往上看.