javascript - 如何停止去抖动的 Rxjs Observable？

Question

我创建了一个 observable，它将在最后一次更改后 3 秒触发，并调用publishChange服务。它可以工作，但我想创建一个doImmediateChange函数，它publishChange立即调用并停止去抖动的 observable。这怎么可能？

我的组件：

class MyComponent {
    private updateSubject = new Subject<string>();

    ngOnInit() {
        this.updateSubject.pipe(
            debounceTime(3000),
            distinctUntilChanged()
        ).subscribe(val => {
            this.srv.publishChange(val);
        });
    }

    doChange(val: string) {
        this.updateSubject.next(val);
    }

    doImmediateChange(val: string) {

        // Stop the current updateSubject if debounce is in progress and call publish immediately
        // ??
        this.srv.publishChange(val);

    }

}

标签： javascriptangularrxjs

Answer 1

debounceTime您可以使用switchMap和进行模拟delay。然后取消内部 ObservabletakeUntil以防止发出等待值。

private updateSubject = new Subject<string>();
private interrupt = new Subject();

ngOnInit() {
  this.updateSubject.pipe(
    switchMap(val => of(val).pipe(
      delay(3000),
      takeUntil(this.interrupt)
    ))
  ).subscribe(val => publish(val));
}

doChange(val: string) {
  this.updateSubject.next(val);
}

doImmediateChange(val: string) {
  this.interrupt.next();
  publish(val);
}

https://stackblitz.com/edit/rxjs-ya93fb