Mohit Bumb Mohit Bumb - 1 year ago 97
Javascript Question

How to return data coming from response instead of subscription json in Angular 2/4

My Service :

fetchData(url,request)
{
return this.http.post(this.apiUrl+url,request).subscribe(
(response) => {return response.json()}
);
}


My Component :

ngOnInit()
{
this.response = this.dataService.fetchData('friends/grow_network',{});
console.log('s ',this.response);
}


if I console response.json() in service it shows proper data which is coming from api but if I console in component it shows like this :

Subscriber {closed: false, _parent: null, _parents: null, _subscriptions: Array(1), syncErrorValue: null…}


how to get data in component which is coming from api not Subscriber data ?

Answer Source

When doing it your way, you write in the variable "reponse" the observable object and not the result. The value of the result is not there yet when calling the method, because it will be asyncronous.

To get what you want you have to do the following:

fetchData(url,request)
  {
    return this.http.post(this.apiUrl+url,request).map(
        (response) => {return response.json()}
    );
  }

ngOnInit()
    {
        this.response = this.dataService.fetchData('friends/grow_network',{})
                         .subscribe(result => {
                           this.response = result;
                           console.log('s ',this.response);
                         });

    }
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download