Hoe gegevens te verkrijgen van waarneembaar in angular2

Ik probeer het resultaat van http-aanroep in Angularaf te drukken met behulp van rxjs

Denk aan de volgende 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());
    }
}

Telkens wanneer ik probeerde het resultaat van getConfigaf te drukken, keerde het altijd terug

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

ook al retourneer ik in plaats daarvan een json-object.

Hoe kan ik het resultaat van getConfigafdrukken?


Antwoord 1, autoriteit 100%

U moet zich abonneren op het waarneembare en een callback doorgeven die verzonden waarden verwerkt

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

Antwoord 2, autoriteit 23%

Angular is gebaseerd op waarneembare in plaats van beloftebasis vanaf angularjs 1.x, dus wanneer we proberen gegevens te verkrijgen met behulp van http, wordt waarneembaar in plaats van belofte geretourneerd, zoals u deed

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

Om vervolgens gegevens te krijgen en te laten zien, moeten we deze converteren naar de gewenste vorm met behulp van RxJs-functies zoals de .map() function and .subscribe()

.map() wordt gebruikt om het waarneembare (ontvangen van http-verzoek) om te zetten in een vorm zoals .json(), .text()zoals vermeld op de officiële website van Angular,

.subscribe() wordt gebruikt om die waarneembare respons te abonneren en in een variabele te plaatsen, zodat we deze in de weergave weergeven

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

Antwoord 3, autoriteit 14%

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

Other episodes