捕获从注入组件的服务发出的事件
Catch event emitted from service injected into component
我通过依赖注入插入了一个服务组件(组件A),这个服务组件A不在组件B的模板中。
如何捕获服务组件发出的事件 - 如何在 parent 组件(组件 B)中捕获它?我已经将发射命令放入 child 组件中,如下所示:
@Output() hostReady = new EventEmitter();
我正在发出这样的事件:
hostReady.emit();
我需要做什么才能在 parent 中捕捉到它?
有不同的方法。
查看食谱示例。
https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#child-to-parent
好吧,既然我之前没有发布我的解决方案,我不妨现在发布一下。所以,我所做的是实现了一个订阅者模式。所有想要了解事件的组件都订阅了它,并且当事件被触发时,它们就知道了。解决方案处理 rxjs 对象:
import { Subject } from 'rxjs/Subject';
我有一个特殊组件 intercommService
将事件声明为 rxjs 主题,如下所示:
selectedLanguage: Subject<string>;
constructor() {
this.selectedLanguage = new Subject<any>();
}
然后,每个组件(也注入了此依赖项)都可以触发事件,使用:
this.intercomm.selectedLanguage.next(language);
并且每个订阅者组件都会将其作为对该事件的订阅,即,在构造函数中,订阅者将注入该依赖项,并将观察其事件:
constructor(private intercomm: IntercommService) {
this.intercomm.selectedLanguage.asObservable().subscribe((value: any) => {
// Do something with value
});
}
我通过依赖注入插入了一个服务组件(组件A),这个服务组件A不在组件B的模板中。
如何捕获服务组件发出的事件 - 如何在 parent 组件(组件 B)中捕获它?我已经将发射命令放入 child 组件中,如下所示:
@Output() hostReady = new EventEmitter();
我正在发出这样的事件:
hostReady.emit();
我需要做什么才能在 parent 中捕捉到它?
有不同的方法。
查看食谱示例。
https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#child-to-parent
好吧,既然我之前没有发布我的解决方案,我不妨现在发布一下。所以,我所做的是实现了一个订阅者模式。所有想要了解事件的组件都订阅了它,并且当事件被触发时,它们就知道了。解决方案处理 rxjs 对象:
import { Subject } from 'rxjs/Subject';
我有一个特殊组件 intercommService
将事件声明为 rxjs 主题,如下所示:
selectedLanguage: Subject<string>;
constructor() {
this.selectedLanguage = new Subject<any>();
}
然后,每个组件(也注入了此依赖项)都可以触发事件,使用:
this.intercomm.selectedLanguage.next(language);
并且每个订阅者组件都会将其作为对该事件的订阅,即,在构造函数中,订阅者将注入该依赖项,并将观察其事件:
constructor(private intercomm: IntercommService) {
this.intercomm.selectedLanguage.asObservable().subscribe((value: any) => {
// Do something with value
});
}