发送http请求之前的Angular 2延迟答案

【问题标题】：Angular 2 delay before send http request发送http请求之前的Angular 2延迟
【发布时间】：2017-12-01 23:38:35
【问题描述】：

我正在为同一个 API 循环执行一些请求。在服务器端，我需要检查以前的结果以进行一些更改。但是如果请求不止一个循环，我看不到之前的结果。

在组件中：

this.service.createEmail(...).delay(5000).debounceTime(5000).timeout(5000).subscribe(...);

并在服务中：

createEmail(...): Observable<Json> {
    return this.http
            .post('url',
              JSON.stringify(model),
              { headers: this.headers })
            .delay(5000).debounceTime(5000).timeout(5000)
            .map((response: Response) => {
                return this.responseService.extractData(response);
            })
            .catch(error => {
                return this.errorService.handleError(error);
            });
        }

没有帮助我。存在需要的进口。只是 js setInterval 帮助了我。

如何通过其他方式在http请求之前进行延迟？

【问题讨论】：

你试过setTimeout(() => { .. }, 5000) 吗？也许这可能会有所帮助
是的，我试过了，但也没有用。
问题是您在循环中发出请求。循环不会等待超时，而是几乎同时尝试触发所有请求。 debounce 将确保只触发最后一个请求。这就是为什么您看不到超过 1 条回复的原因。如果您可以完全放弃循环并使用 concatMap 的可观察链接将起作用。

标签： angular rxjs observable

【解决方案1】：

你可以使用 switchMap 和计时器：

createEmail(...): Observable<Json> {
   return Observable
            .timer(5000)
            .switchMap(() => 
                this.http.post(
                  'url', 
                  JSON.stringify(model),
                  {headers: this.headers}
                )
            )
            .map((response: Response) => {
                return this.responseService.extractData(response);
            })
            .catch(error => {
               return this.errorService.handleError(error);
            });
}

你可以在 switchMap 之前添加 debounceTime 和另一个 rx 操作符。

我邀请您查看 switchMap 的文档以了解更多信息：https://www.learnrxjs.io/operators/transformation/switchmap.html

当您不想立即传递 observable 的结果时，可以使用 .delay。比如我想模拟API响应的延迟时使用它。

【讨论】：

不，只是请求不会发送到服务器
@A.Gladkiy 您是否专门导入每个 rxjs 运算符？比如导入“rxjs/add/operator/map”
是的，switchMap, map, timer, catch
@A.Gladkiy 也可以观察到？你已经等了 5 秒 :)
是的，Observable 也是，我想在这种情况下我会出错