구성 요소 코드를 통해 Angular2 자재 관리

Question

test() 메서드가 호출 될 때 start.toggle() 함수 (Angular 2 재질 md-sidenav- 레이아웃 구성 요소에 속함)를 시작하려고합니다. md-sidenav-layout start.toggle()을 에 전화하는 방법 app.component.ts?

app.component.html

<md-sidenav-layout class="sidenav" fullscreen> 
    <md-sidenav #start> 
     Start Side Drawer 
     <br> 
     <md-nav-list> 
      <a md-list-item [routerLink]="['']">Home</a> 
      <a md-list-item [routerLink]="['about']">About</a> 
     </md-nav-list> 
     <button md-button (click)="start.close()">Close</button> 
    </md-sidenav> 

    <div class="content"> 
     <button md-button (click)="start.toggle()">Toggle Start Side Drawer</button> 

     <button md-button (click)="test()">Test Button</button> 
     <main> 
      <router-outlet></router-outlet> 
     </main> 
     <footer> 
     </footer> 
    </div> 
</md-sidenav-layout> 

app.component.ts

import {Component} from '@angular/core'; 
// what to import here? 

@Component({ 
    selector: 'my-app', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.scss'], 
}) 
export class AppComponent { 
    constructor() { 
    } 

    test() { 
     // how to call md-sidenav-layout start.toggle() properly here? 
     start.toggle(); 
    } 
} 

Answer 1

은 함수에 객체를 전달합니다, 그래서 당신은 그것을 사용할 수 있습니다. 구성 요소에서

<button md-button (click)="test(start)">Test Button</button> 

test(start: any) { 
     start.toggle(); 
    }