Как правильно обработаь ексепшн для async pipe?

У меня есть такой метод - который возвращает observable this.applicationObs с данными:
this.applicationObs = this.route.paramMap.pipe(
            filter((params) => params.has('id')),
            switchMap((params) => this.applicationService.getApplicationDetails(params.get('id'))),
            tap((response) => {
                const fabricaSidebar = fabricApplicationSidebarMenu(response.application);
                this.sidebarSections = fabricaSidebar.getSidebarMenuItems();
            }),
        );


Далее в шаблоне я делаю проверку:



<ng-template #loading>
    <div class="loader">
        <mat-spinner [diameter]="50"></mat-spinner>
    </div>
</ng-template>


Как мне словить error, например если сервер не отвечает и вывести другой шаблон с ощибкой или вызвать alert с сообщением. Сейчас - если сервак не отвечает - бесконечно крутится
<code><ng-template #loading>
    <div class="loader">
        <mat-spinner [diameter]="50"></mat-spinner>
    </div>
</ng-template></code>
  • Вопрос задан
  • 23 просмотра
Пригласить эксперта
Ответы на вопрос 1
Xuxicheta
@Xuxicheta Куратор тега Angular
инженер
Можно попробовать сделать такую обертку для запросов
function requestWrapper(request) {
  return concat(
    of({
      loading: true,
      completed: false,
      value: null,
      error: null,
    }),
    request.pipe(
      map(value => ({
        loading: false,
        completed: true,
        value,
        error: null,
      })),
      catchError(error => of({
        loading: false,
        completed: true,
        value: null,
        error,
      }))
    )
  )
}

Можно даже декоратором оформить или в виде оператора и сделать свой кастомный async пайп, который умеет стразу отображать только value

А всякие стейт-менеджеры обычно предлагают свои механизмы получения статуса сущностей.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы