组件的sidenav切换

组件的sidenav切换

本文介绍了角度2材质:组件的sidenav切换的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在项目中以这种方式使用Angular 2 Material sidenav:

I'm using Angular 2 Material sidenav in my project this way:

<md-sidenav-layout>
  <md-sidenav #start mode="side" [opened]="true">
      <md-nav-list>
      </md-nav-list>
  </md-sidenav>

  <button md-button (click)="start.toggle()">Close</button>

  <router-outlet></router-outlet>

</md-sidenav-layout>

如何从我的组件而不是具有点击事件的元素中调用start.toggle()?

How to call start.toggle() from my component instead of element with click event?

感谢您阅读

推荐答案

您要在控制器中声明一个引用组件内部MdSidenavViewChild,如下所示:

You want to declare a ViewChild in your controller that references the MdSidenav inside your component, like this:

// Sidemenu
@ViewChild('start') sidenav: MdSidenav;

其中start是要引用的组件的名称,在本例中为sidenav.

where start is the name of the component you want to reference, in this case the sidenav.

接下来,您可以在该sidenav上调用方法,例如控制器功能内的this.sidenav.toggle().

Next you can call methods on that sidenav, like this.sidenav.toggle() inside your controller's functions.

https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-view-child

这篇关于角度2材质:组件的sidenav切换的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 01:39