为什么在角度解析器中未定义ngrx / store的AppState

时间:2019-07-16 20:36:42

标签: angular ngrx angular-resolver

我正在尝试制作一个解析器,它将查询我的商店的某些状态 如果存在,那么我只是在传递,但是如果不存在(在刷新和丢失状态的情况下),我希望获取该数据并再次更新我的商店。

我的问题是,当我尝试到达解析器内部的状态时,它是未定义的。但是redux开发人员工具说它设置成功。

在以下情况下会发生这种情况:

我希望登录,并且在从后端获取数据后,在这种情况下设置一些状态,有关当前登录用户的信息。

解析器放置在根路由''上,并且如果未设置该数据但用户具有有效的auth jwt令牌。我只想重新设置商店。如果状态存在,则什么都不做。

登录组件-登录方法:

this.authService.signIn(signInRequest)
    .pipe(take(1))
    .subscribe(
      (currentUser: CurrentUser) => {
        this.store.dispatch(login({currentUser}));
        setTimeout(() => this.router.navigate(['/']), 5000);
        // this.router.navigate(['/']);
        //this.authService.setSession(currentUser);
      },
      (err: HttpErrorResponse) => { 
        this.error = true;
        console.log(err)
      }
    );

我已将此setTimeout放置用于调试目的,因为我认为有效执行此路由器导航会使事情变得混乱,并且过快到达解析器。

动作和减速器

export const login = createAction(
'[Auth API] Login',
props<AuthState>())

全局reducers(使用原理图自动生成的index.ts)

    export interface AppState {
      auth: AuthState
     }

export const reducers: ActionReducerMap<AppState> = {
  //  router: routerReducer,
  auth: authReducer
  };


export const authReducer: ActionReducer<AuthState, Action> = createReducer(
initialAuthState,

on(AuthActions.login, (state: AuthState, action) => {
    return {
        currentUser: action.currentUser
    }
})

核心模块导入:

StoreModule.forRoot(reducers, {
        metaReducers,
        runtimeChecks : {
            strictStateImmutability: true,
            strictActionImmutability: true,
            // strictActionSerializability: true,
            // strictStateSerializability:true
        }}),
    StoreDevtoolsModule.instrument({maxAge: 25, logOnly: environment.production}),
    EffectsModule.forRoot([]),

正如我所说,我希望我的解析器可以检查我期望的某些状态,并在状态不存在时获取新数据。

不幸的是,我的整个状态是未定义的内部解析器。

Undefined state in debugger State in redux dev tools

解析器代码:

 @Injectable({ providedIn: 'root' })
export class CurrentUserResolver implements Resolve<void> {



constructor(
    private store: Store<AppState>
) { }


resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): void {

     this.store.pipe(
        map((authState) => authState),
        tap(currentUser => {
            // is undefined...
    )

}

0 个答案:

没有答案