Angular 5 http客户端，在订阅时执行功能答案

【问题标题】：Angular 5 http client, execute function on subscribeAngular 5 http客户端，在订阅时执行功能
【发布时间】：2018-07-01 12:01:00
【问题描述】：

我想在处理 http 请求时显示加载微调器。但是我有一个问题，因为即使没有活动订阅者，当我返回 observable 时微调器也会调用。仅当有人订阅http时如何调用showSpinner()函数？

private request(type, args={}){
  this.showSpinner();
  return this.http.post(this.apiUrl+type,args);
}

【问题讨论】：

标签： angular rxjs observable

【解决方案1】：

您可以将 HTTP 调用 this.http.post 包装为 defer。这是 RxJS 6 示例：

import { defer } from 'rxjs';

private request(type, args={}){
  return defer(
    () => {
      this.showSpinner();
      return this.http.post(this.apiUrl+type,args);
    })
    .pipe(
      finalize(() => this.hideSpinner()),
    );
}

【讨论】：

【解决方案2】：

只有在调用 subscribe() 时才可以使用 defer() 函数创建实际的 observable，从而显示当时的微调器：

return defer(() => {
  this.showSpinners();
  return this.http.post(this.apiUrl+type, args);
});

【讨论】：