CODEWITHSUNDEEP
jsonangulartypescriptasp.net-web-apihttp-post
DarioN1
DarioN1

Reputation: 2552

Angular2 Http.Post - How to view webapi response

I'm new to Angular2/Typescript and I'm writing my first web application.

I'm trying to call a webapi using POST, it works, if I intercept the call using FIDDLER I can see the Json response.

Now, how I can log in the browser console the json ouput?

The code is this:

code call

var s = this.myService.doSearch();
s.subscribe(
    data=> this.data = data,
    error => this.errorMessage = <any>error
);

console.log(s);

service method

doSearch() {
var url = this.baseUrl;

return this.http.get(url)
    .map(response => response.json())
    .catch(this.handleError);
}

My question is: how and where I can view and manage the Json Output ?

Thanks

Upvotes: 3

Views: 904

Answers (3)

Mario Petrovic
Mario Petrovic

Reputation: 8312

You need to console.log it after the async code is finished:

var s = this.myService.doSearch();
s.subscribe(
    data=> {
          this.data = data;
          console.log(data);
    },
    error => this.errorMessage = <any>error
);

Upvotes: 1

isuruAb
isuruAb

Reputation: 2240

Try this this will print what you have in your returned observable .

var s = this.myService.doSearch();
s.subscribe(data=> {
       this.data = data;
       console.log(data);
       },
       error => this.errorMessage = <any>error
);

Always remember If you want to get data from observable.you need to subscribe it.

you can't log it like this console.log(s); because s returns an observable. you should subscribe and refer those data inside the subscribe .

Upvotes: 1

user7605396
user7605396

Reputation:

If you are debug or run your application in browser you can got to inspect and then move to the Network tab. In this tab select your POST Request and the go to the tab Response and voila there is your json Response

Edit:

To log all response data do this:
return this.http.get(url)
    .map(res => res.json())
    .subscribe(data => { console.log(data);})
    .catch(this.handleError);
}

Upvotes: 1

Related Questions