NgRx 没有跳过错误时的“成功”操作

Question

我有这个效果：

  updateBook$ = createEffect(() =>
    this._actions$.pipe(
      ofType(START_UPDATE_BOOK),
      exhaustMap(action => this._api.updateBook({id: action.id}).pipe(
        map(data => UPDATE_BOOK({id: data.id})),
        catchError(error => of(HANDLE_ERROR({error})))
      )
    )
  ));

API服务中的这个方法：

  updateBook(id: string): Observable<any> {
    const params = {
      id
    };
    return this.httpClient
      .get<any>(`${this._host}/${this.module}/api/${this.endpoint}/Delete`, {params});
  }

但是，当给定的 ID 错误并且服务器返回 400 Bad Request 时，仍然会调用 UPDATE_BOOK 操作（不久之后会调用 HANDLE_ERROR）。为什么会发生这种情况并且没有省略 UPDATE_BOOK 操作？ 感谢您提供的任何帮助。

更新（我忘记为其中一个操作定义减速器）： 像这样定义的动作：

export const START_UPDATE_BOOK = createAction(
  '[Books] Start update book',
  props<{id: string}>()
);

export const UPDATE_BOOK = createAction(
  '[Books] Update book',
  props<{id: string}>()
);

export const HANDLE_ERROR = createAction(
  '[Books] Handle Error',
  props<{error: string}>()
);

减速机：

const bookReducer = createReducer(initialState,
  on(START_UPDATE_BOOK),
  on(UPDATE_BOOK, (state, payload) => {
      const book: Book = state.books.find(el => el.Id === payload.id);
      book.Status = Status.PENDING;
      return {
        ...state,
      };
  }),
  on(HANDLE_ERROR, (state, payload) => {
    return {
      ...state,
      error: payload.error
    };
  })
);

Answer 1

这似乎很奇怪，如果你有复制品我很乐意看看。

你能验证一下吗：

• 服务器实际上返回了一个400
• 您使用拦截器吗？如果是这样，请确认他们没有将 400 映射到 200