Получить результат из запроса HttpGet в методе "getter" Angular 7 service

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"))

Но данные должны быть загружены службой только один раз, при загрузке приложения