Access Angular2 Материал sidenav в компоненте

Question

Я хочу иметь доступ к sidenav, определенному в * .component.html, чтобы я мог динамически управлять его свойствами (поверх | push | side), такими как ширина экрана.

Как получить доступ к мкр-sidenav ниже

<div class='layout-header'> 
    <md-sidenav-layout fullscreen> 
    <md-sidenav mode="side" #sidenav> 
     <md-nav-list> 
     <md-list-item>Blah</md-list-item> 
     </md-nav-list> 
    </md-sidenav> 
    ... 
</div> 

из его компонент, определенный в * .component.ts?

@Component({ 
    selector: 'layout-header', 
    templateUrl: './header.component.html', 
    styleUrls: ['./header.component.css'], 
    directives: [ 
    MD_SIDENAV_DIRECTIVES, 
    MD_LIST_DIRECTIVES, 
    MD_CARD_DIRECTIVES, 
    MdToolbar, 
    MdButton, 
    MdInput, 
    MdCheckbox, 
    MdRadioGroup, 
    MdRadioButton, 
    MdIcon 
    ], 
    providers: [] 
}) 
export class HeaderComponent { 

} 

Я в настоящее время

Answer 1

Вы можете попробовать атрибут связывания:

<md-sidenav [attr.mode]="sidenavMode" #sidenav> 

А в компоненте у вас есть переменная-член можно установить:

export class HeaderComponent { 
    sidenavMode: string = 'side'; 
} 

Answer 2

Ok, вам необходимо связать свойство компонента следующим образом:

<md-sidenav [mode]="{{sidenavMode}}" #sidenav>