Angular2 HTML指令中＃的含義是什麼

Question

我試圖觸發sidenav（打開和關閉）的狀態。我有這樣的：

<div class="viewport"> 
    <md-toolbar color="primary"> 
    <button *ngIf="!isNavbarOpen" md-icon-button (click)="sidenav.open()"><md-icon>menu</md-icon></button> 
    <button *ngIf="isNavbarOpen" md-icon-button (click)="sidenav.close()"><md-icon>close</md-icon></button> 
    <span class="toolbar-title">Title</span> 
    </md-toolbar> 
    <md-sidenav-layout> 
    <md-sidenav align="start" mode="over" #sidenav> 
     Sidenav 
    </md-sidenav> 
    </md-sidenav-layout> 
</div> 

我如何使用#sidenav從我的打字稿文件改變isNavbarOpen場每當sidenav狀態變化？

或

我該如何重寫sidenav.open（）方法？

Answer 1

這是一個更好的方法，因此您可以使用所有屬性並訂閱所有事件。不要將它傳遞給open（）/ close（）函數。

import { Component, ViewChild, OnInit } from '@angular/core'; 
import { MdSidenav } from '@angular/material'; 

@Component({ 
.... 
}) 
export class AppComponent implements OnInit { 
    public isNavbarOpen: boolean; 

    // This gets a reference to the #sidenav 
    @ViewChild('sidenav') sidenav: MdSidenav; 

    ngOnInit() { 
     // Subscribe to the onCloseStart event 
     this.sidenav.onCloseStart.subscribe(() => { 
      this.isNavbarOpen = true; 
     }); 
    } 

    open() { 
     this.sideNav.open(); 
    } 
}