Получить ответ об ошибке от ngrx@effects к компоненту - PullRequest
Новая
       4

Получить ответ об ошибке от ngrx@effects к компоненту

3 голосов
/ 14 января 2020

Мне нужно установить проверку ошибок сервера для каждого поля ввода в форме. Проблема в том, что я использую ngrx@store, и фактически у меня есть 

 @Effect({ dispatch: false })
  error$ = this.actions$.pipe(
    ofType(actions.UserActionTypes.Error),
    map(
      (error: actions.Error) => {
        new actions.Error(error);
      }
      //this.notificationService.warn(error.error.message)
    )
  );

. С этим кодом я сохраняю ошибки для хранения.

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

    this.errorsMsgs$ = this.store.select(fromStore.UserSelectors.getErrors);
    this.errorsMsgs$.pipe(takeUntil(this.destroy$)).subscribe((error: any) => {
      console.log(error);
      for (let err of error) {
        if (err.field === "username") {
          this.usernameError = err.defaultMessage;
        }
        if (err.field === "lastName") {
          this.lastNameError = err.defaultMessage;
        }
        if (err.field === "firstName") {
          this.firstNameError = err.defaultMessage;
        }
        if (err.field === "email") {
          this.emailError = err.defaultMessage;
        }
        if (err.field === "phone") {
          this.phoneError = err.defaultMessage;
        }
        if (err.field === "enabled") {
          this.enabledError = err.defaultMessage;
        }
      }
    });

Проблема в том, что, если я добавлю этот код в ngOnInit, я получу ошибку в консоли, потому что ошибок еще не существует.

ОШИБКА TypeError: ошибка не повторяется

Функция для CRUD находится в ngrx@effect, и есть ошибка завершения успеха ... Как узнать В компоненте, когда метод submit имеет ответ об ошибке и когда мне нужно вызвать это метод в компоненте для ошибок?

Есть ли способ вызвать этот метод в компоненте из эффектов?

Вот ответ об ошибке: 

{
  "timestamp": "2020-01-14T11:37:51.533+0000",
  "status": 400,
  "error": "Bad Request",
  "errors": [{...}
  ],
  "message": "Validation failed for object='user'. Error count: 6",
  "path": "/user/add/"
}

1 Ответ

3 голосов
/ 14 января 2020

Вы можете просто подписаться на наблюдаемый канал actions и просто отфильтровать его с помощью исключенного действия с операторской функцией ofType() в компоненте. Пример: ngOnInit(){ this.actions$.pipe(ofType(action)).subscribe(action => console.log(action.payload)); }. Вам нужно ввести actions$ наблюдаемое в конструкторе, начиная с import { Actions} from '@ngrx/effects';. Или, если вы хотите сохранить этот результат в хранилище, просто используйте редуктор и после этого выберите исключенные значения из хранилища.

...