Как получить данные из наблюдаемых в angular2

Я пытаюсь напечатать результат вызова http в Angular, используя rxjs

Рассмотрим следующий код

import { Component, Injectable, OnInit } from '@angular/core';
import { Http, HTTP_PROVIDERS } from '@angular/http';
import 'rxjs/Rx';

@Injectable()
class myHTTPService {
  constructor(private http: Http) {}

  configEndPoint: string = '/my_url/get_config';

  getConfig() {

    return this.http
      .get(this.configEndPoint)
      .map(res => res.json());
  }
}

@Component({
    selector: 'my-app',
    templateUrl: './myTemplate',
    providers: [HTTP_PROVIDERS, myHTTPService],


})
export class AppComponent implements OnInit {

    constructor(private myService: myHTTPService) { }

    ngOnInit() {
      console.log(this.myService.getConfig());
    }
}

Всякий раз, когда я пытался распечатать результат getconfig, он всегда возвращает

Observable {_isScalar: false, source: Observable, operator: MapOperator}

хотя я возвращаю объект json вместо этого.

Как распечатать результат getconfig?

Ответы

Ответ 1

Вам нужно подписаться на наблюдаемый и передать обратный вызов, который обрабатывает значения

this.myService.getConfig().subscribe(val => console.log(val));

Ответ 2

Angular основывается на наблюдаемой вместо обещания базе с угловыми значениями 1.x, поэтому, когда мы пытаемся получить данные с помощью http, она возвращает наблюдаемые вместо обещания, как вы делали

 return this.http
      .get(this.configEndPoint)
      .map(res => res.json());

затем, чтобы получить данные и показать их, мы должны преобразовать их в желаемую форму, используя функции RxJs, такие как .map() function and .subscribe()

.map() используется для преобразования наблюдаемого (полученного от http запроса) в любую форму типа .json(), .text(), как указано на официальном сайте Angular,

.subscribe() используется для подписки на наблюдаемый ответ и тонну на некоторую переменную, поэтому мы показываем ее в виде

this.myService.getConfig().subscribe(res => {
   console.log(res);
   this.data = res;
});

Ответ 3

this.myService.getConfig().subscribe(
  (res) => console.log(res),
  (err) => console.log(err),
  () => console.log('done!')
);