执行功能：Angular2

我有一个孩子组件内如下功能：执行功能：Angular2

reload() { 
    clearInterval(this.points); 
    this.initiateInterval(); 
    this.redrawImages(); 
}

它在window.resize事件重绘几张图片。

但在父组件中，我有一个按钮menu-burger，它缩小了窗口。我想要绑定到这个按钮的子组件的reload()函数。

这是从父组件我的按钮：

<button class="collapseMenuIcon" (click)="toggleMenu()">

我一直在寻找关于它的堆栈中的其他问题，但对我来说 - 这reload函数使用了很多东西，在这个子组件。

其他问题的解决方案也很少，因为Angular2经常更改。

在此先感谢您，我将为您提供所有答案。

2017-02-24 Natalia

共享服务是一个非常好的选择。如果你想要的话，根据你的使用情况，你可以在没有服务的情况下在父母和孩子之间使用一个主题。

申报主题儿童：

import { Subject } from 'rxjs/Subject'; 

public static fireEvent: Subject<boolean> = new Subject();

和订阅在构造函数：

constructor(....) { 
    MyChildComponent.fireEvent.subscribe(res => { 
     this.reload(); 
    }); 
}

而在你的父母：

import { MyChildComponent } from './my-path';

，并在您按一下按钮，告诉孩子火reload -method：

toggleMenu() { 
    MyChildComponent.fireEvent.next(true); 
}

2017-02-24 16:15:44 Alex

组件之间有几种通信方式。我个人使用一种服务来达到这个目的，而且它对我很好。

最后一个例子（该服务的一个）是我用的一个，并且是实现非常简单。

编辑：

使用服务让您拥有独立的组件，能够在应用程序的其它部分使用它们。您也可以发送/接收数据，通信是双方的。我强烈推荐这种方法。

2017-02-24 15:28:47 SrAxi

回答