Prüfen, ob material2 sidenav geöffnet ist

Question

Gibt es eine Möglichkeit zu überprüfen, ob das Element sidenav geöffnet ist? Nach der API Dokumentation gibt es einen isOpen? Parameter, aber in meinem Fall wirft es eine Ausnahme: EXCEPTION: Error in ./AppComponent class AppComponent - inline template:2:2 caused by: this.sidenav.isOpen is not a function

import { Component, OnInit, ElementRef } from '@angular/core'; 

@Component({ 
    selector: 'app-sidebar', 
    template: ` 
    <md-sidenav #sidenav mode="side" class="app-sidenav"> 
     Sidenav 
    </md-sidenav> 
    `, 
    styleUrls: ['./sidebar.component.css'], 
    host: { 
     '(document:click)': 'onClick($event)', 
    } 
}) 
export class SidebarComponent implements OnInit { 

    constructor(private sidenav: ElementRef) { } 

    ngOnInit() { 
    } 

    onClick() { 
    if (this.sidenav.isOpen()) { 
     this.sidenav.close(); 
    } 
    } 

} 

Answer 1

Sie haben ViewChild verwenden Kontrolle über sidenav

@ViewChild('sidenav') sidenav: any; 
opened: any = false; 
onClick() { 
    console.log(this.sidenav.opened); 
} 

Plunkr

Answer 2

zu erhalten Sie missverstehen die Dokumentation isOpen? ist ein optionaler Parameter der Toggle-Funktion.

Sie können stattdessen die Eigenschaft überprüfen. Das funktioniert bei mir:

@ViewChild('sidenav') sidenav: MatSidenav; 
onClick() { 
    console.log(`isOpen: ${this.sidenav.opened}`); 
}