Наблюдаемая подписка всегда выполняется несмотря на ошибку

Question

Я создаю веб-сайт Angular, который общается с кучей API, и я следую Angular docs , чтобы попробовать и использовать лучшие практики для выдачи HTTP-запросов и последующей успешной и неудачной обработки.

Я жестко запрограммировал один из моих API для возврата ошибки 500, и я могу успешно обработать это 500 в приложении Angular, используя определение catchError в pipe послеВызов службы HTTP, код выглядит следующим образом:

updateRemoteUserProfile(userProfile: UserProfile): Observable<UserProfile>{
    return this.http.put<UserProfile>(AuthService.userProfileApi, userProfile).pipe(
    catchError(this.handleError<UserProfile>('updateUserProfile', 'Error', 'Error updating profile', userProfile))
    );
}

private handleError<T> (operation = 'operation', title, notification, result?: T) {
    return (error: any): Observable<T> => {

      this.toastrService.error(notification, title);
      console.error(error);

      return of(result as T);
    };
}

Проблема, с которой я сталкиваюсь, заключается в том, что когда я вызываю updateRemoteUserProfileMethod, используя следующий код, метод подписки всегда выполняется, и всплывающее сообщение об успехе всплываетодновременно с ошибкой:

updateUserProfile(forename: string, surname: string){
    let userProfile: UserProfile = { forename: forename, surname: surname}
    this.updateRemoteUserProfile(userProfile).subscribe(() => {
        this.displayName = forename + ' ' + surname;
        this.displayNameChange.next(this.displayName);
        this.toastrService.success('Profile updated successfully', 'Success');
    });
}

Я уверен, что упускаю что-то довольно простое и фундаментальное, но все это основано на документах Angular, так что я сейчас в растерянности.

Большое спасибо

Answer 1

Мы также можем вернуть EMPTY () observable, который завершит наблюдаемое, выполнив метод подписки complete.

import {empty} from 'rxjs';

private handleError<T> (operation = 'operation', title, notification, result?: T) {
    return (error: any): Observable<T> => {

      this.toastrService.error(notification, title);
      console.error(error);

      return empty();
    };
}

Answer 2

Ну, вот что делает catchError: вы улавливаете ошибку, так что ошибки больше нет.

Если вы хотите распространить ошибку, либо

• не перехватите ее, либо
• используйте tap(null, handler) для распространения исходной ошибки, но добавьте сторону-эффект, когда это происходит (например, регистрация или поджаривание ошибки), или
• возвращает throwError(...) из catchError вместо of(...), чтобы выдать ошибку, отличную от исходной