Angular HTTP Service, сделайте что-нибудь после завершения запроса

Question

Мне удалось установить соединение между моим сервером express.js и моим приложением Angular (приложение Angular также размещается на сервере Express).

Я создал компонент (который сейчас ничего не делает), но моя цель - вызвать метод службы (этот метод службы выполняет запрос http для получения строки JSON с сервера) и когда методполучил строку JSON успешно, я хочу сделать что-то с этим в моем компоненте.

My Service:

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';

import { Observable } from 'rxjs';
@Injectable({
  providedIn: 'root'
})
export class DbConnectorService {
  private baseUrl:string = "http://localhost:3000"
  constructor(private http: Http) { }
  getAllData() {
    this.http.get(this.baseUrl + '/api/getData').subscribe((res) => {
      console.log(res.text());
    }); 
  }
}

Выполнение HTTP-запроса и получение JSON пока работает (JSON находится внутри res.text()), но как мне вызвать метод из компонента и разрешитьскажем, распечатать его там, когда он успешно получил строку JSON?

Answer 1

getAllData() {
  return this.http.get(...)
  .pipe(tap(res => console.log(res))); // if you want to log it immediately
}

внедрить DbConnectionService в компонент

и в компоненте

dbConnectionService.getAllData().subscribe(// do sth with response);

Вы также можете указать универсальный тип Observable

getAllData(): Observable<TypeOfData> {
  return this.http.get<TypeOfData>(...);
}

Answer 2

Метод get возвращает Observable, который представляет собой поток данных, который может быть активным и развернутым только функцией subscribe() (вы можете подумать, что observable представляет собой канал, содержащий данные, а функция subscribe()клапан, он активирует трубу, поэтому поток данных из нее)

Таким образом, вы можете определить метод в вашем сервисе

getAllData() : Observable<any> {
  return this.http.get(...);
}

Затем внедрить и подписаться на него в ваших компонентах

this.dbConnectionService.getAllData().subscribe(console.log);