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/
本文版權歸作者和部落格園共有,歡迎轉載,但未經作者同意必須保留此段宣告,且在文章頁面明顯位置給出原文連線,否則保留追究法律責任的權利。
相關文章
- vue父子關係元件間的雙向資料繫結Vue元件
- 父子元件之間通訊元件
- Vue2.0父子元件間通訊Vue元件
- Elasticsearch 父子關係Elasticsearch
- 3.Vue非父子元件之間的通訊Vue元件
- Vue 父子元件的通訊Vue元件
- ElasticSearch系列--父子關係Elasticsearch
- vue 父子元件通訊Vue元件
- 非父子元件間的傳值元件
- 關於React父子元件通訊知識總結React元件
- Vue中父子元件通訊——元件todolistVue元件
- vue 2 0 元件:父子元件通訊Vue元件
- vue2.0 非父子元件之間的單一事件通訊Vue元件事件
- 父子元件之間的傳值問題元件
- dotnet 設定 X11 建立視窗之間的父子關係
- lucene join解決父子關係索引索引
- vue---元件間傳遞訊息(父子傳遞訊息,兄弟傳遞訊息)Vue元件
- Vue2---父子元件之間的訪問Vue元件
- 我學react之父子元件通訊React元件
- vue父子元件通訊高階用法Vue元件
- Vue父子元件通訊小總結Vue元件
- vue--select父子元件通訊Vue元件
- vue---註冊元件、元件之間父子傳值Vue元件
- vue之父子元件間通訊例項講解(props、$ref、$emit)Vue元件MIT
- ES 筆記四十三:文件的父子關係筆記
- 統計學三大相關係數之Pearson相關係數、Spearman相關係數
- prop父子元件通訊,動靜態prop元件
- 會vue,學習react元件父子通訊VueReact元件
- Vue之父子、同級元件的通訊詳解Vue元件
- FAILGROUP和REDUNDANCY之間的關係關係!AI
- 父子頁面之間跨域通訊的方法跨域
- 微信小程式父子元件之間的資料傳遞微信小程式元件
- Vue 與 React 父子元件之間的家長裡短VueReact元件
- 元件:非父子間傳值(同級傳值)元件
- vue父子元件之間傳值以及方法呼叫Vue元件
- vue2.0父子、兄弟元件通訊,$emit使用Vue元件MIT
- Spring和SpringMVC父子容器關係初窺SpringMVC
- 簡單說說vue的父子元件,父子元件傳值和vuexVue元件