javascript - 如何在 RxJs 中满足条件后立即取消订阅

标签 javascript angular rxjs observable

我是 RxJs 可观察对象的新手,一旦满足条件,我发现很难取消订阅循环,请你帮我

在下面的函数中,如果代码到达 if block 我想取消订阅 Observables

在问这个问题之前,我已经经历了以下问题,但没有一个对我有太大帮助

  • Rxjs observable wait until some condition is met
  • AngularJs - RXJS Observable unsubscribe

  • Javascript函数
    this.router.events.subscribe((url: any) => {
        url = this.router.url;
        if ((url === "/profile" || url === "/summary") && this.filterConfigFlag === false) {
    
            /*
            Perform operations
            */
    
        } else {
            console.log(typeof (url), url);
    
        }
    });
    

    最佳答案

    你可能想要 takeWhile :

    this.router.events
      .pipe(
        takeWhile(url => url === ...), // when the condition isn't met it'll complete immediately
      )
      .subscribe(...);
    

    但如果您还想包含最后一个值(完成 Observable 的值),您需要执行以下操作:

    在 RxJS 6.4 之前
    this.router.events
      .pipe(
        concatMap(url => url === ... ? of(url, null) : of(url)),
        takeWhile(Boolean),
      )
      .subscribe(...);
    

    从 RxJS 6.4 开始

    RxJS 6.4 向 takeWhile 添加了重载,现在可以像这样包含最后一个值:
    this.router.events
      .pipe(
        takeWhile(url => url === ..., true),
      )
      .subscribe(...);
    

    关于javascript - 如何在 RxJs 中满足条件后立即取消订阅,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51196776/

    相关文章:

    在 html 页面中查找框然后设置内容所需的 Javascript

    javascript - 计算父 Div 的定位

    javascript - Angular - 观察者 map 未按预期工作

    javascript - 将变量传递并保留到下一页 - AngularJS

    javascript - 从 c# PhysicalFile 通过 json 发送二进制数据会导致字符编码丢失

    javascript - 服务和提供者的继承和多态性

    angular - 如何使用 Angular 将对象添加到包含数组的现有动态秋田商店

    angular - 当我切换到另一个页面时 bootstrap-select 消失

    angular - 使用原始数组本身生成可观察数组

    javascript - RxJS:takeUntil 忽略主题事件