Angular / Ionic - Handle JSON "error" property

Question

I'm using TypeScript, Angular 5.0. My backend response is summarized in this interface:

export interface JSONResponse {
  error?: {
    code: number,
    message: string
  };
  data?: {};
}

The function in my service to get the data from the server is:

httpGet(url: string, httpParams: HttpParams) {
  return new Promise((resolve, reject) => {
    this.http.get<LoginResponse>(url, {params: httpParams})
      .subscribe(res => {
        resolve(res.data);
      }, err => {
        // handle http get related errors here
        console.log(err);
      });
  });
}

And then the component that consume this service to render the template:

buttonClicked(event) {
  this.myService.httpGet('myAPIurl', someRequestParams)
    .then((data) => {
      this.myData = data;
    }, (err) => {
      console.log(err);
    });
}

Where would be the place to handle the error checking of the response from my backend?

That is, if property data is present, the response is successful and do the proper processing of my data; if property error is present, I notify the user with the code/message error.

I'm trying to figure out where is the place in the code to perform the JSON parsing, and check whether the data or error field exists or not, and eventually inform in the UI the processed data or the error — photonic.bean
– photonic.bean, Commented Nov 15, 2017 at 20:37
Why can't you do it here (err) => { console.log(err); in the buttonClicked() event? — Sampath
– Sampath, Commented Nov 15, 2017 at 20:40

Sampath · Accepted Answer · 2017-11-15 20:57:47Z

1

If you need to do it in a more generic way you can use IonicErrorHandler.

The IonicErrorHandler intercepts the default Console error handling and displays runtime errors as an overlay when using Ionic's Dev Build Server.

import { NgModule, ErrorHandler } from '@angular/core';
import { IonicErrorHandler } from 'ionic-angular';

@NgModule({
  providers: [{ provide: ErrorHandler, useClass: IonicErrorHandler }]
})
class AppModule {}

If you want to customise it you can do that too.

class MyErrorHandler implements ErrorHandler {
  handleError(err: any): void {
    // do something with the error
  }
}

@NgModule({
  providers: [{ provide: ErrorHandler, useClass: MyErrorHandler }]
})
class AppModule {}

answered Nov 15, 2017 at 20:57

Sampath

66.2k70 gold badges327 silver badges461 bronze badges

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

Collectives™ on Stack Overflow

Angular / Ionic - Handle JSON "error" property

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related