如何启动和停止RXJS中可观察到的间隔?

时间:2016-01-25 15:52:28

标签: javascript rxjs

我有一个非常简单的timeInterval observable,我想在不断开订阅者的情况下启动/停止传输(无论可观察状态如何,都应该等待和等待)。是可能的,如果有的话怎么样?

var source = Rx.Observable
  .interval(500)
  .timeInterval()
  .map(function (x) { return x.value + ':' + x.interval; })
  .take(10);

  var subscription = source.subscribe(
  function (x) {
     $("#result").append('Next: ' + x + ' ');
  },
  function (err) {
    $("#result").append('Error: ' + err);
  },
  function () {
    $("#result").append('Completed');
  });

一般性评论:我见过的大多数例子都展示了如何定义观察者和订阅者。我如何影响现有对象的行为?

2 个答案:

答案 0 :(得分:16)

取决于停止/恢复信号的来源。我能想到的最简单的方法是使用pausable operator,正如文档所说,热点可观察效果更好。因此,在以下示例代码中,我删除了take(10)(您的可暂停信号现在来自pauser主题),并添加了share以将您的观察结果变为热点。

var pauser = new Rx.Subject();
var source = Rx.Observable
  .interval(500)
  .timeInterval()
  .map(function (x) { return x.value + ':' + x.interval; })
  .share()
  .pausable(pauser);

var subscription = source.subscribe(
  function (x) {
     $("#result").append('Next: ' + x + ' ');
  },
  function (err) {
    $("#result").append('Error: ' + err);
  },
  function () {
    $("#result").append('Completed');
});

  // To begin the flow
pauser.onNext(true); // or source.resume();

// To pause the flow at any point
pauser.onNext(false);  // or source.pause();

这是一个more sophisticated example,它会每10个项暂停一下你的来源:

// Helper functions
function emits ( who, who_ ) {return function ( x ) {
 who.innerHTML = [who.innerHTML, who_ + " emits " + JSON.stringify(x)].join("\n");
};}

var pauser = new Rx.Subject();
var source = Rx.Observable
  .interval(500)
  .timeInterval()
  .map(function (x) { return x.value + ':' + x.interval; })
  .share();
var pausableSource = source
  .pausable(pauser);

source
  .scan(function (acc, _){return acc+1}, 0)
  .map(function(counter){return !!(parseInt(counter/10) % 2)})
  .do(emits(ta_validation, 'scan'))
  .subscribe(pauser);

var subscription = pausableSource.subscribe(
  function (x) {
     $("#ta_result").append('Next: ' + x + ' ');
  },
  function (err) {
    $("#ta_result").append('Error: ' + err);
  },
  function () {
    $("#ta_result").append('Completed');
});

你现在应该回答第二个问题。将您给出的可观察量与相关的RxJS运算符相结合,以实现您的用例。这就是我在这里所做的。

答案 1 :(得分:0)

不是最优雅的,但可能是最简单的:

  timeSubscription: Subscription
  timer: Observable<number>;
  time = 0;

toggle() {
if (!this.timer)
  this.timer = interval(500);

if (!this.timeSubscription || this.timeSubscription.closed)
  this.timeSubscription = this.timer.subscribe(tick => { // running
    console.log(this.time++);
  });
else
  this.timeSubscription.unsubscribe(); // not running 
}