角度4 /角材2 - Sidenavは定義されていません。コンポーネント宣言にこのようなメンバーが含まれていません

Question

角度4と素材デザイン2を使用して新しいプロジェクトを作成しました。

私はsidenavとツールバーを追加しました。

すべてのHTMLがapp.comentent.htmlにあったが、私はその後、ツールバーのコードを追加して新しいコンポーネントを作成し、私はエラーを取得開始したときにすべてがうまく働いた：ここ

はコードです：

APP-topnav成分：

<md-toolbar color="primary"> 

    <button md-icon-button (click)="sidenav.toggle()"> 
    <md-icon class="md-24 material-icons">menu</md-icon> 
    </button> 

    <span class="topbar-spacer"></span> 

    <button md-icon-button class="topbar-button-right"> 
    <md-icon class="md-24 material-icons">notifications</md-icon> 
    </button> 

    <button md-icon-button class="topbar-button-right"> 
    <md-icon class="md-24 material-icons">more_vert</md-icon> 
    </button> 

</md-toolbar> 

app.component：

<md-sidenav-container> 
    <md-sidenav #sidenav mode="side" class="app-sidenav"> 
     <md-nav-list> 
     <div class="app-user-photo"> 
      <img class="round user" src="../assets/image.jpg" alt=""> 
     </div> 
     <md-list> 
      <md-list-item><i class="material-icons">Home</i><span>Home</span></md-list-item> 
     </md-list> 
     </md-nav-list> 
    </md-sidenav> 
    <app-topnav></app-topnav> 
    <div class="app-content"> 
     Content area<br><br><br><br><br><br><br> 
    </div> 
</md-sidenav-container>** 

これを修正して、sidenav toogleが再び機能するようにするにはどうすればよいですか？

Answer 1

私はあなたと同じ問題を一時点で持っています。 md-toolbarをmd-sidenav-containerに分けないで解決しました。 githubのスニペットの多くは、sidenavとツールバーを分​​けていません。しばしば、2人は同じビューにあります。私は2つを分けない方がいいです。

<md-sidenav-container> 
    <md-sidenav #sidenav mode="side" class="app-sidenav"> 
    <md-nav-list> 
     <div class="app-user-photo"> 
     <img class="round user" src="../assets/image.jpg" alt=""> 
     </div> 
     <md-list> 
     <md-list-item><i class="material-icons">Home</i><span>Home</span></md-list-item> 
     </md-list> 
    </md-nav-list> 
    </md-sidenav> 

    <md-toolbar color="primary"> 

    <button md-icon-button (click)="sidenav.toggle()"> 
     <md-icon class="md-24 material-icons">menu</md-icon> 
    </button> 

    <span class="topbar-spacer"></span> 

    <button md-icon-button class="topbar-button-right"> 
     <md-icon class="md-24 material-icons">notifications</md-icon> 
    </button> 

    <button md-icon-button class="topbar-button-right"> 
     <md-icon class="md-24 material-icons">more_vert</md-icon> 
    </button> 

    </md-toolbar> 

    <div class="app-content"> 
    Content area<br><br><br><br><br><br><br> 
    </div> 
</md-sidenav-container>