rxjs可观察的变化间隔

Bri*_*ach 11 javascript rxjs typescript

我有一个观察者,应该每隔X秒完成一次动作.X的值动态变化.我一直无法绕过如何在运行时动态更改此间隔.根据我的理解,我的想法中的一个重大突破是Observables一旦被定义就无法改变,所以尝试用新的区间值重新定义Observalbe似乎不是正确的方法.

我一直在尝试使用位于https://www.learnrxjs.io/operators/transformation/switchmap.html的代码.

到目前为止,我认为这switchMap至少是在正确的轨道上.有人能够提供一个例子或指向我可能对我有用的资源吗?

至少,世界肯定需要更多的RxJs例子!

car*_*ant 12

您可以使用和Subject一起动态控制周期.每当主题发出一个值时,该值可用于指定间隔的周期:switchMapinterval

const t = Date.now();

let subject = new Rx.Subject();
subject
  .switchMap(period => Rx.Observable.interval(period))
  .do(() => console.log('some action at time T+' + (Date.now() - t)))
  .take(8)
  .subscribe();

subject.next(50);
setTimeout(() => subject.next(100), 200);
setTimeout(() => subject.next(200), 400);
Run Code Online (Sandbox Code Playgroud)
<script src="https://unpkg.com/rxjs@5/bundles/Rx.min.js"></script>
Run Code Online (Sandbox Code Playgroud)


Bri*_*ach 8

添加一个工作示例来帮助Google员工

HTML:

let startButton = document.getElementById('start');
let stopButton  = document.getElementById('stop');
let updateButton = document.getElementById('update');
let i1 = document.getElementById('i1');

const start$ = Rx.Observable.fromEvent(startButton, 'click');
const stop$ = Rx.Observable.fromEvent(stopButton, 'click');
const update$ = Rx.Observable.fromEvent(updateButton, 'click')

const period = () => (parseInt(i1.value));


Rx.Observable.merge(
    start$, 
    update$, 
  )
  .switchMap(() => {
    return Rx.Observable.interval(period()).takeUntil(stop$);
  })
  .subscribe(res => {
    console.log('here in the subscription:' + res);
  })
Run Code Online (Sandbox Code Playgroud)

JavaScript(TypeScript):

<script src="https://unpkg.com/rxjs@5/bundles/Rx.min.js"></script>
<body>
  <button id="start">Start</button>
  <button id="stop">Stop</button>
  <button id="update">Update</button>
  <input id="i1" value=100></input>
</body>
Run Code Online (Sandbox Code Playgroud)