当角度条件为真时退订可观察对象答案

【问题标题】：Unsubscribe from a observable when condition is true in angular当角度条件为真时退订可观察对象
【发布时间】：2022-01-23 17:15:33
【问题描述】：

我试图在加载 5 秒后关闭一个弹出窗口，但订阅在此之前完成，所以我想在加载的变量为 true 时取消订阅

    this.closed = false;
    this.loaded$.subscribe(loaded => {
      if (loaded) {
        setTimeout(() => {
          this.modalService.dismissActiveModal();
        }, 5000);
      }
    }).unsubscribe();
  }

【问题讨论】：

你能用 RxJS 的 takeWhile 或 takeUntil 得到类似的结果吗？ learnrxjs.io/learn-rxjs/operators/filtering/takewhile 或 learnrxjs.io/learn-rxjs/operators/filtering/takeuntil

标签： javascript angular typescript observable unsubscribe

【解决方案1】：

this.closed = false;
// define the subscription
const subscription: Subscription = this.loaded$.subscribe(loaded => {
  if (loaded) {
    setTimeout(() => {
      this.modalService.dismissActiveModal();
      subscription.unsubscribe(); // unsubscribe here
    }, 5000);
  }
});

这个怎么样？

【讨论】：

【解决方案2】：

this.closed = false;
this.loaded$
.pipe(
  filter(loaded => loaded),
  switchMap(_ => interval(5000)),
  take(1),
  tap(_ => this.modalService.dismissActiveModal())
)
.subscribe();

【讨论】：

这不是问题的答案！
它通过使用take(1)在加载为真时取消订阅，它也会延迟关闭模式。
请edit解释而不是评论更新。
代码对于任何了解 Rxjs 的人来说都是一目了然的。