aller chercher des données dans Angular 4

Question

Je commence avec le rendu angulaire 4 et côté serveur, actuellement j'essaie d'obtenir un Proof of Concept en récupérant certaines données de l'une de mes API externes. Cette API renvoie un objet Json.

Le rendu du site était plutôt bon, mais maintenant que j'ai inclus l'appel pour récupérer des données, ce n'est pas rendu et la réponse que je reçois ne semble pas être ce que je devrais obtenir.

Dans les app.components.ts j'ajouté:

private apiUrl= 'https://myapi/Users'; 
    data: any = {}; 

    constructor(private http: Http){ 
    this.getUsers(); 
    this.getData(); 
    } 

    getData(){ 
    let res=this.http.get(this.apiUrl).map((res: Response)=>res.json()); 
    console.log("result:",res) 
    return res; 
    } 

    getUsers(){ 
    this.getData().subscribe(data=>{ 
     this.data=data; 
    }) 
    } 

Maintenant, comme vous pouvez le voir, dans la méthode getData J'imprime dans la console le résultat des appels http, mais je reçois ceci: Pourquoi je n'arrive pas à l'objet JSON? Pourquoi? ce qui pourrait être la raison?

Answer 1

Puisque votre getUsers() appelle en interne getData, vous n'avez plus besoin d'appeler à l'intérieur du constructeur.

constructor(private http: Http){ 
    this.getUsers(); 
    //remove this line this.getData(); 
} 

placer également la console.log dans la méthode pour voir les abonner données réelles,

getUsers(){ 
    this.getData().subscribe(data=>{ 
     this.data=data; 
     console.log(this.data); 
    }) 
    } 

EDIT Comme le commentaire ci-dessous indique, il est recommandé de ne pas avoir votre appel de méthode à l'intérieur constructeur, faire vos composants pour implémenter ngOnit et ajouter la méthode à l'intérieur