Parse error body in Angular 2

Question

I would like to ask if how can I parse the error body that the API return to me.

This is the image of the API return:

Here's my code:

login(username,password){
        let headers = new Headers();
        headers.append('Content-Type','application/json');

        return this.http.post(this.configEnvironment.url() + "oauth/access_token",
            JSON.stringify(
                {
                    username: username,
                    password: password,
                    grant_type: "password",
                    client_id: "xxxxxxx",
                    client_secret: "xxxxxxxx"
                }
            ),
            { headers }
        )
        .map(res => res.json())
        .catch((err:any) =>{
            console.log(err);
            return Observable.throw(new Error(err));
         });

     }

I can access the URL,status,statusText and etc using this:

err.status,err,url,error.statusText

My problem is i can't get the value of the error body.

BeetleJuice · Accepted Answer · 2017-11-13 19:53:02Z

13

Your catch is actually receiving a Response. You can access its details with json()

import { Response }  from "@angular/http";
...
.catch((err:Response) =>{
            let details = err.json().error;
            console.log(details);
            return Observable.throw(new Error(details));
         });

note: This answer is about the @angular/http library. As of Angular 5, this library is deprecated in favor of @angular/common/http

edited Nov 13, 2017 at 19:53

answered Oct 16, 2016 at 6:53

BeetleJuice

41.1k24 gold badges120 silver badges181 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

BeetleJuice Over a year ago

@SydneyLoteria No problem. You'll get better IDE assistance if you change the type of err from any to Response as I've just done.

Ka Mok Over a year ago

What's the Angular 5 @angular/common/http method?

Collectives™ on Stack Overflow

Parse error body in Angular 2

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related