angular - RxJs 6 - React to concatMap in filter or takeWhile condition

Question

I use concatMap to do two API calls consecutively, but the second one should only be run if a checkbox is checked. So this is my code:

this.myService.createArticle(article)
  .pipe(
    filter(() => this.checkbox),
    concatMap(() => return this.mailer.createOtherResource(data)),
  }).subscribe(
    (x) => { console.log('OK', x); },
    error => console.error('FALLA', error),
    () => console.log('Finally I have really reached the END')
  );

The thing is that, if the check box is not checked, even if the first observable does not return an error, the OK function is never run, only the 'finally' one, and I need it to inform the user that the resource was created. What can I do?

I tried with takeWhile instead pipe, and same result.

Answer 1

您订阅的最后一次回调仅在第二次调用时运行。如果您希望第一次 HTTP 调用完成后调用方法，请尝试以下操作：

this.myService.createArticle(article)
  .pipe(
    finalize(() => console.log('Finally I have really reached the END (of the first call)'))
    filter(() => this.checkbox),
    concatMap(() => return this.mailer.createOtherResource(data)),
  }).subscribe(
    (x) => { console.log('OK', x); },
    error => console.error('FALLA', error),
    () => console.log('Finally I have really reached the END')
  );

Answer 2

我不知道您的createOtherResource函数返回了什么，但它是 Observable 吗？

也许你应该试试这个：

this.myService.createArticle(article)
  .pipe(
    filter(() => this.checkbox),
    concatMap(() => of(this.mailer.createOtherResource(data))),
  })
  .subscribe(
    (x) => console.log('OK', x),
    error => console.error('FALLA', error),
    () => console.log('Finally I have really reached the END')
  );