Subscribe and Map in Angular 2

Question

I try to get data from my json file

ngOnInit() {
   this.http.get('assets/json/buildings.json',  { responseType: 'text'})
    .map(response => response)
     .subscribe(result => this.data = result);
    console.log(this.data);
}

But I get undefined... Could you please help me and explain why I do not get my data.

Answer 1

You're getting undefined because your calling log right away but the response that sets "data" is asynchronous, so it doesn't get set until the api returns a value.

if you did:

this.http.get('assets/json/buildings.json',  { responseType: 'text'})
  .map(response => response)
  .subscribe(result => {
     this.data = result;
     console.log(this.data);
  });

you would see the value because now you're waiting until after it has definitely been asynchronously fetched till you try to log it.

Answer 2

Why are you even using the map function if you just return the response

this.http.get('assets/json/buildings.json',  { responseType: 'text'})
  .subscribe(result => {
     this.data = result;
     console.log(this.data);
  });