Angular 6 无限循环并等待 API 响应答案

【问题标题】：Angular 6 endless loop and wait for API responseAngular 6 无限循环并等待 API 响应
【发布时间】：2019-02-05 04:21:12
【问题描述】：

我想在 Angular 6 中实现以下目标：

而（真）{

调用 API
处理响应
等待 1 秒

}

我尝试了 TimerObservable，但在请求完成后等待 1 秒失败，因为它是异步的。目的是在请求需要很长时间时不调用 api，而是在请求需要很短的时间完成时快速响应。

我的代码是：

TimerObservable.create(0, 1000)
  .subscribe(() => {
    this.api.getData().subscribe(
      response => {
        console.log(response);
      }
    );
  });

【问题讨论】：

Repeat request (Angular2 - http.get) n seconds after finished的可能重复

标签： angular rxjs

【解决方案1】：

你总是可以为此使用递归。将调用放在函数中，成功后等待 1 秒，然后再次调用该函数。

callApi() {
  this.api.getData().subscribe(
    response => {
      console.log(response);
      setTimeout(() => this.callApi(), 1000);
    }
  );
}

请记住，如果出现故障，此代码将停止，因此您可能还需要添加一个错误处理程序。例如，如果出现错误，您可能需要等待更长时间

【讨论】：

这对我来说似乎是最简单的解决方案，有什么缺点吗？
不是我能想到的，但正如我所说，如果没有错误处理程序，它将停止轮询第一个错误。

【解决方案2】：

您应该使用排气映射 (see doc here) 运算符将您的“间隔”滴答转换为 api 调用。 ExhaustMap 将等待 API 调用完成，然后再启动一个新的。

试试这个（rxjs 6 语法）：

import { interval, of } from 'rxjs';
import { exhaustMap } from 'rxjs/operators';

interval(1000)
.pipe(
    exhaustMap(_ => this.api.getData())
)
.subscribe(response => console.log(response));

【讨论】：

虽然据我了解，这不会在每次 HTTP 调用后等待 1 秒，而是会忽略间隔发出的值，直到 HTTP 调用完成，然后在下一次发出时再次调用，未来可能在 0 到 1000 毫秒之间。
@DavidWalschots 是的，你是对的。但我认为它会完成这项工作：D

【解决方案3】：

这有点笨拙，但如果你想总是先处理响应然后等待，我不知道有什么更简单的方法。

Observable.timer(0, 1000)
  .concatMap(() => mockApiGetData()
    .concatMap(val => Observable.of(null)
      .delay(1000)
      .takeWhile(() => false)
      .startWith(val)
    )
  )
  .subscribe(val => console.log('process', val))

现场演示：https://stackblitz.com/edit/typescript-lemfdn?file=index.ts

另见：Observable and how to control results pace

【讨论】：