Angular - parser error from response

Question

When the sent data is bad, it gets from the server tables with validator errors, as you can see in the picture. My question is how to get to this array so that you do not have to refer to each element individually on reasonably err.error.erros.email or err.error.erros.password. I would like to display these errors using sweetalert, one below the other.

My code:

 this.http.post('https://mylocalhost/api/1.3/user/login', params, {headers: config})
        .subscribe(res => {
                this.userData = res;
                swal('App', 'Zostałeś zalogowany pomyślnie', 'success');
                localStorage.setItem('x-ticket', this.userData['x-ticket']);
            },
            (err: HttpErrorResponse) => {
                console.log(err);
            });

@Volodymyr Khmil yes, i need simple way. Although in time I would like to do, maybe some service that I will be hooking up and he will parse these errors. — PawelC
– PawelC, Commented Aug 19, 2018 at 8:11
Did you try catchError() from rxJs, and inside extract your errors learnrxjs.io/operators/error_handling/catch.html — Volodymyr K
– Volodymyr K, Commented Aug 19, 2018 at 8:16

user184994 · Accepted Answer · 2018-08-19 08:57:03Z

2

You can use the following to convert it into an array

var error = {
  errors: {
     email: "This is an email error",
     password: "This is a password error"
  }
}


// Create an array from the object
let arr = Object.keys(error.errors).map((key) => error.errors[key]);

// Some examples of using the value
console.log(arr);
console.log(arr[0]);
console.log(arr.join("\n"));

Once you have an array, you can then display those however you wish without needing to refer to each error type.

answered Aug 19, 2018 at 8:57

user184994

18.3k2 gold badges51 silver badges54 bronze badges

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

1 Comment

PawelC Over a year ago

Works perfect :D Thank for help

Arghya Saha · Accepted Answer · 2018-08-19 08:14:11Z

0

Below is one of the angular 5 code examples I'm using. You should be able to edit and and make it work in your case.

postNewInventoryEntry(data: any) {
    return this.http.post(this.api_url + '/inventory-management/inventory/', data)
      .map(res => res)
      .catch((e: any) => {
      alert('ERROR: ' + e.error['msg']);
      return _throw(e.error)});
  }

answered Aug 19, 2018 at 8:14

Arghya Saha

5,7734 gold badges28 silver badges52 bronze badges

Collectives™ on Stack Overflow

Angular - parser error from response

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related