Why doesn't the interceptor return the ErrorResponse to the handler?

Question

Angular

I'm trying to write an interceptor that will prevent the script from exiting in case of an error from the server.
This is how I call the service method in the component:

const res = await this.service.getLandingPage(url);
// do actions with res
console.log(res)

The service method itself:

async getLandingPage<T>(url: string): Promise<Page> {
    return this.get<Page>(url,
      {
        observe: "response"
      }
    ).toPromise();
  }

Interceptor:

return next.handle(request).pipe(
      catchError((error: HttpErrorResponse) => {
        this.log.error(error);
        return EMPTY;
      })
    );

In this case, if the response from the server is successful , HttpResponse arrives in res as expected, and if the server responds with an error, then nothing ( undefined ) in res. If error is returned instead of an empty Observable in the interceptor, then the script will fall and the script will not reach the console.log(res) line in the component . How to make the interceptor so that in the above case, when an error occurs from the server, HttpErrorResponse gets into res and not undefined ?

Answer 1

return throwError(error)
catchError requires an observable to be returned, and you give it a plain value