Не может отображать ошибки бэкэнда в компоненте HTML - Angular

Question

Я пытаюсь отобразить ошибку бэкэнда, которую я генерирую с помощью errorHandler, но она ничего не показывает.

Как я могу это показать?

это возвращается undefined

HTML

 //This triggers the observable, if it has an error it sets that error to the variable backendError 
    {{(pickupAvailabilityList$ | async)}} 

    {{ backendError}}

КОМПОНЕНТ ТС

getPickupAvailability(
    equipmentLookup: EquipmentID[]
  ): Observable<PickupAvailability[]> {
    this.backendError = this.pickupAvailabilityService.getErrorMessage();
    return this.pickupAvailabilityService.getAmountDue(equipmentLookup);
}

СЕРВИС ТС Консоль логин getErrors() дает мне undefined

getAmountDue(equipmentID: EquipmentID[]): Observable<PickupAvailability[]> {
    this.errorHandler.errorMessages = '';
    return this.http
      .post<PickupAvailability>(
        this.BASE_URL + this.AMOUNT_DUE_URL,
        equipmentID
      )
      .pipe(catchError(this.errorHandler.handleError));
  }

  getErrorMessage(): string {
    this.errorMessage = this.errorHandler.errorMessages;
    return this.errorHandler.errorMessages;
}

ERROR HANDLER SERVICE TS Журнал консоли распечатывается

handleError(error: HttpErrorResponse) {
    // To know the version of RxJS npm list --depth=0
    if (error.error instanceof ErrorEvent) {
      // A client-side or network error occurred. Handle it accordingly.
      console.error('An error occurred: ', error.error.message);
      this.errorMessages =
        error.error.message;
    } else {
      // The backend returned an unsuccessful response code.
      // The response body may contain clues as to what went wrong,
      console.error(
        `Backend returned code ${error.status}` + ` body was: ${error.message}`
      );
      this.errorMessages =
        `Backend returned code ${error.status}` + ` body was: ${error.message}`;
    }
    // return an observable with a user-facing error message
    return _throw('Something bad happened; please try again later.');
}

Answer 1

Вам нужно сделать что-то вроде:

 .pipe(catchError((err,caught)=>{
     return this.errorHandler.handleError();
  }));

Так что ваш handleError Метод не теряет контекст службы, в которой он определен.