Rx.js,使用Subject来自Observable的多播

时间:2017-04-29 00:42:47

标签: javascript rxjs

如果有Rx.js专家吗?我试图按照任意数量的网站(包括rx.js文档)上的说明,使用主题多播一个可观察对象。

var mainDataSource = Rx.Observable.from(summaries[0].added)
  //add a timestamp to each live entry as it passes through
  .timestamp()
  .map(function(scriptElement) { 
     var array = [scriptElement, scriptElement.timestamp]; return array; 
  })
  //check contents of the array
  .do(function(array) { console.log(array); });

var multicaster = new Rx.Subject();
var subSource = mainDataSource.subscribe(multicaster);
//attach the inline observer to the multicaster subject
multicaster.subscribe(
    function (x) { console.log('Value published to inlineScriptObserver: ' + x); },
    function (e) { console.log('onError: ' + e.message); },
    function () { console.log('inlineScriptObserver onCompleted'); }
);
//attach the external observer to the multicaster subject
multicaster.subscribe(
    function (x) { console.log('Value published to externalScriptObserver: ' + x); },
    function (e) { console.log('onError: ' + e.message); },
    function () { console.log('externalScriptObserver onCompleted'); }
);

我得到的输出如下:

[Object, 1493425651491]
inlineScriptObserver onCompleted
externalScriptObserver onCompleted

因此,当onCompleted事件从一个事件传输到另一个事件时,Subject和Observable明显连接。但是,我没有得到任何数据。正确格式的数据位于Observable的末尾,但不会在主题观察者的控制台中打印。

我错过了什么?它让我不知所措。

2 个答案:

答案 0 :(得分:0)

好的,回答你自己的问题可能不好,但万一其他人也有同样的问题......

我读过的文档肯定已经过时了,与rx.js 4不是5或者其他东西有关。截至今天,根据此页面,

https://github.com/ReactiveX/rxjs/blob/master/doc/subject.md

上述示例的正确语法如下:

var multicaster = new Rx.Subject();
var mainDataSource = Rx.Observable.from(summaries[0].added)

//add a timestamp to each live entry as it passes through
.timestamp()
//log the timestamp for testing purposes
.do(function(scriptElement) { console.log("mainDataSource Timestamp: " + scriptElement.timestamp); })
//include the timestamp in array and deliver that array to subscribers
.map(function(scriptElement) { var array = [scriptElement, scriptElement.timestamp]; return array; })
//check contents of the array
do(function(array) { console.log(array); });

var multicastedDataSource = mainDataSource.multicast(multicaster);
//attach the inline observer to the multicaster subject
multicastedDataSource.subscribe(val => console.log(val), null, () => console.log('inlineScriptObserver complete'));
//attach the external observer to the multicaster subject
multicastedDataSource.subscribe(val => console.log(val), null, () => console.log('externalScriptObserver complete'));
multicastedDataSource.connect();

关键的不同之处在于使用multicast()而不是订阅了observable,然后是connect()对主题的要求,以及观察者订阅的观察者。

难怪我的旧版rx.js书在亚马逊上如此便宜......

答案 1 :(得分:0)

在触发事件之前订阅或使用ReplaySubject。见the working fiddle

var mainDataSource = Rx.Observable.from([1, 2, 3])
  //add a timestamp to each live entry as it passes through
  .timestamp()
  .map(function(scriptElement) { 
     var array = [scriptElement, scriptElement.timestamp]; return array; 
  })
  //check contents of the array
  .do(function(array) { console.log(array); });

var multicaster = new Rx.ReplaySubject();
var subSource = mainDataSource.subscribe(multicaster);
//attach the inline observer to the multicaster subject
multicaster.subscribe(
    function (x) { console.log('Value published to inlineScriptObserver: ' + x); },
    function (e) { console.log('onError: ' + e.message); },
    function () { console.log('inlineScriptObserver onCompleted'); }
);
//attach the external observer to the multicaster subject
multicaster.subscribe(
    function (x) { console.log('Value published to externalScriptObserver: ' + x); },
    function (e) { console.log('onError: ' + e.message); },
    function () { console.log('externalScriptObserver onCompleted'); }
);

输出结果为:

[Object, 1493467831996]
[Object, 1493467831999]
[Object, 1493467832000]
Value published to inlineScriptObserver: [object Object],1493467831996
Value published to inlineScriptObserver: [object Object],1493467831999
Value published to inlineScriptObserver: [object Object],1493467832000
inlineScriptObserver onCompleted
Value published to externalScriptObserver: [object Object],1493467831996
Value published to externalScriptObserver: [object Object],1493467831999
Value published to externalScriptObserver: [object Object],1493467832000
externalScriptObserver onCompleted