RXJS元件間超越父子關係的相互通訊

weixin_34221276發表於2018-05-28

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/
本文版權歸作者和部落格園共有,歡迎轉載,但未經作者同意必須保留此段宣告,且在文章頁面明顯位置給出原文連線,否則保留追究法律責任的權利。

相關文章