So erhalten Sie Daten von Observable in Angular2

Ich versuche, das Ergebnis des httpAnrufs Angularmit zu druckenrxjs

Betrachten Sie den folgenden Code

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());
    }
}

Wann immer ich versuchte, das Ergebnis auszudrucken, kehre getconfigimmer zurück

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

obwohl ich stattdessen ein json-Objekt zurückgebe.

Wie würde ich das Ergebnis ausdrucken getConfig?

Sie müssen das Observable abonnieren und einen Rückruf übergeben, der die ausgegebenen Werte verarbeitet

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

Angular basiert auf der Basis von Observable anstelle von Promise ab AngularJS 1.x. Wenn wir also versuchen, Daten mithilfe httpdieser Basis zu erhalten, wird Observable anstelle von Promise zurückgegeben, wie Sie es getan haben

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

Um dann Daten zu erhalten und sie anzuzeigen, müssen wir sie mit RxJs Funktionen wie in die gewünschte Form konvertieren .map() function and .subscribe()

.map () wird verwendet, um das Observable (von http request erhalten) in eine beliebige Form zu konvertieren, wie .json(), .text() auf der offiziellen Website von Angular angegeben.

.subscribe () wird verwendet, um diese beobachtbaren Antworten zu abonnieren und in eine Variable zu setzen, von der aus wir sie in der Ansicht anzeigen

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

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