访问组件中的Angular2 Material sidenav

时间:2016-06-30 13:43:49

标签: angular angular-material2

我希望能够访问* .component.html中定义的sidenav,这样我就可以动态控制其模式(over | push | side)基于屏幕宽度等属性。

如何访问

下面的md-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 {

}

我现在

2 个答案:

答案 0 :(得分:0)

你可以尝试属性绑定:

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

在您的组件中,您可以设置一个成员变量:

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

答案 1 :(得分:0)

好的,您需要绑定组件属性,如下所示:

groovy.lang.MissingMethodException: No signature of method: com.myPackage.myController.Location.withoutTenantRestriction() is applicable for argument types: