首页 > 解决方案 > Angular 8 NgRx - 错误:检测到不可序列化的操作

问题描述

我需要在我的应用程序状态中有一个全局错误对象。所以我创建了一个 http 拦截器来调度setError操作:

export interface IlgError {
  message: string;
  responseError: HttpErrorResponse;
}

export const setError = createAction("[Global] Error Occurred", props<{ errorObj: IlgError }>());

但是当我派遣我得到错误:

错误:在“errorObj.responseError”处检测到不可序列化的操作

我的应用程序模块设置:

StoreRouterConnectingModule.forRoot({ routerState: RouterState.Minimal }),

“不可序列化”到底是什么意思?我可以为我的某些操作禁用此功能吗?

标签: javascriptangulartypescriptreduxngrx

解决方案


在对象中传递一个带有属性的props对象可以解决这个问题,但是当您在要传递的对象中有相当多的属性时,它会变得很麻烦。

更好的方法是将动作定义为:

export const login = createAction(
 '[Login Page] Login',
  props<IlgError>(),
)

并在下面使用来调度动作

  loadMovies$ = createEffect(() => this.actions$.pipe(
    ofType('[Login Page] Login'),
    mergeMap(() => this.moviesService.getAll()
      .pipe(
        map(movies => ({ type: '[Movies API] Movies Loaded Success', payload: movies })),
        catchError((error: IlgError) => of(failureAction(error)),)
      ))
    )
  );

推荐阅读