組件間事件綁定Angular 2

我在Angular應用程序中有一個主組件和許多子組件。我使用的是渲染子組件。像這樣的東西。組件間事件綁定Angular 2

<body class="nav-md"> 
    <mainComponent></mainComponent> 
    <router-outlet></router-outlet> 
</body>

我的主要組件有一個搜索框和一個按鈕。當我點擊mainComponent中的按鈕時，我想調用我的子組件的函數。任何幫助，將不勝感激。

來源

2017-04-17 Amit Anand

請新增主要成分和子組件的HTMl \ TS的代碼，這樣任何一個可以提供幫助。 –

在這種情況下，您可以使用ViewChild。

例子：

import { Component, ViewChild } from '@angular/core'; 
import { ChildComponent } from '../child.component'; 

@Component({ 
    selector: 'mainComponent', 
    template: '<search (onSearch)="onSearch($event)"></search><child-component></child-component>', 
}) 
export class MainComopnent{ 
    // ViewChild takes a class type or a reference name string. 
    // Here we are using the type 
    @ViewChild(ChildComponent) child: ChildComponent; 

    onSearch(search: string) { 
     this.child.say(search); 
    } 
} 

@Component({ 
    selector: 'child-component' 
}) 
export class ChildComponent { 
    say(something: string) { 
     console.log(something); 
    } 
}

來源

2017-04-17 14:35:54 LLL

雖然這個鏈接可能回答這個問題，但最好在這裏包含答案的基本部分，並提供供參考的鏈接。如果鏈接頁面更改，則僅鏈接答案可能會失效。 - [來自評論]（/ review/low-quality-posts/15865487） – Adam

@Adam好點，我做到了。 – LLL

組件間事件綁定Angular 2

回答

相關問題