Question

这可能很简单，但是Angular并不是我的强项，它使我花费了比我预期更多的时间。我有一个调用外部API的服务，我想在应用初始化时获取变量，并在其他多个组件中使用它。

我提供以下服务：

import { Injectable } from '@angular/core';
import { HttpClient } from  '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class DatabaseConnectionService {

  API_URL: string = "http://localhost:4044";

  apiResult;

  constructor(private http: HttpClient) { 
    this.dbConn.getApiRoot()
    .subscribe(
      data => this.apiResult = { message: data['message'] }
    );
  }

  getApiRoot() { 
    return this.http.get<Apiroot[]>(this.API_URL);
  }

  returnApiResult() {
    return this.apiResult;
  }

}

在任何其他组件中，我都需要能够调用returnApiResult()并获取变量的值，但是由于它是可观察的，因此它返回为空（我认为应该已经分配了该值，因为它在服务的构造函数中）。任何帮助表示赞赏。

Answer 1

在构造函数中，如下更改代码：

  import { shareReplay } from 'rxjs/operators';

  //...

  constructor(private http: HttpClient) { 
    this.apiResult = this.dbConn.getApiRot().pipe(shareReplay());
  }

通过使用shareReplay运算符，它将在多个订户之间共享结果，并重播结果。这样，您的组件仍可以订阅：

  this.service.apiResult.subscribe(() => console.log("Done"))

但是在应用程序加载时，数据仅需要由服务加载一次

在“ getter”方法Angular 7服务中从HttpGet请求获取结果

1 个答案: