天天看点

RXJS组件间超越父子关系的相互通信RXJS组件间超越父子关系的相互通信

RXJS组件间超越父子关系的相互通信

用到这个的需求是这样的: 组件A有数据变化,将变化的数据流通知组件B接收这个数据流并做相应的变化

实例化RXJS的subject对象

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
/**
 * 事件总线,组件之间可以通过这个服务进行通讯
 */
@Injectable()
export class EventBusService {
    public maintenance: Subject <any> = new Subject<any>();
    constructor() { }
}           

这里通过一个对象类,封装了,可以单独写

在组件A中发送数据流

this.maintenanceService.getFlowChart(data.status).subscribe(res => {
   this.eventBusService.maintenance.next(res);
});           

在组件B监听数据流的变化,并接收数据流

this.eventBusService.maintenance.subscribe((data) => {
    if (data) {
        alert(data);
    }
 });           

作者:

承蒙时光

出处:

http://www.cnblogs.com/timetimetime/

本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

继续阅读