Generic Error Handling Angular 14 - throwError deprecated

Question

So in an earlier version of Angular I had a generic CRUD service and this worked fine:

 deleteById<T>(id: any, apiMethod: string): Observable<T> {

    let callPoint = this.endpoint.concat('/', apiMethod, '/', id);

    return this.httpClient.delete<T>(callPoint, this.httpHeader)
      .pipe(
        retry(1),
        catchError(this.processError)
      )
  }

  processError(err: { error: { message: string; }; status: any; message: any; }) {
    let message = '';
    if (err.error instanceof ErrorEvent) {
      message = err.error.message;
    } else {
      message = `Error Code: ${err.status}\nMessage: ${err.message}`;
    }
    console.log(message);
    return throwError(message);
  }

I now recieve a warning against the return throwError(message); line of processError stating that throwError is deprecated.

If I change this line to:

return new Error(message);

I then get errors against my catchError call in my deleteById method. The catchError now does not like that I am passing this.processError.

I've been scouring the internet, but cannot find any good examples of how I might be able to change this.

Any ideas greatly appreciated.

Answer 1

Accordingly with the RxJs documentation the throwError function uses a function as a parameter.

https://rxjs.dev/api/index/function/throwError

So what you should do is the following.

processError(err: any) { 
  let message = '';
  if (err.error instanceof ErrorEvent) {
    message = err.error.message;
  } else {
    message = `Error Code: ${err.status}\nMessage: ${err.message}`;
  }
  console.log(message);
  return throwError(() => new Error(message)); // use throwError from the rxjs package
}

Hope it helps you!