Question

我想在返回Http请求之前执行一段代码。这是我的代码：

public getEntities(endpoint: String): Observable<T[]> {
  this.openSnackBar('Loading...');
  return this.http.get(endpoint) as Observable<T[]>; }

启动Http get请求时，我正在打开一个显示“正在加载...”的小吃店。我想在完成Http请求并接收到结果但返回结果之前，用this.closeSnackBar()关闭此快餐栏。

有没有办法做到这一点？我已经有了小吃店的代码：

openSnackBar(message: string) {
    this.snackBar.open(message);
  }

  closeSnackBar() {
    this.snackBar.dismiss();
  }

Answer 1

我知道您希望HTTP GET响应中包含一个T类型数组的主体，因此您最好通过使用泛型来告诉Angular HttpClient：

return this.http.get<T[]>(endpoint);

这样，您将不必强制转换为您想要的可观察对象。

为了获得预期的结果，您可以使用tap运算符：

public getEntities(endpoint: String): Observable<T[]> {
  this.openSnackBar('Loading...');
  return this.http.get<T[]>(endpoint).pipe(
    tap((res) => this.closeSnackBar());
}

别忘了从rxjs（tap）导入。

也许值得一提的是，如果HTTP请求中也发生错误，则必须确保关闭小吃店，请参见以下内容：

https://blog.angular-university.io/rxjs-error-handling/

由@Karol Trybulec代表合理的评论进行编辑。

返回Http结果之前执行代码

1 个答案: