使用 ngrx 和选择器等待资源加载到守卫中

Question

TLDR：我有一个isLoading选择器，我想在我的守卫中使用它来仅在此选择器为假时激活路线。

这是减速器：

export const initialState: State = {
  loaded: false,
  loading: false,
  success: {
    [...]
  }
};


export const reducer = createReducer(
  initialState,

  on(
    fromApiActions.loadRequest,
    (state): State => ({
      ...state,
      loading: true
    })
  ),

  on(
    fromApiActions.loadRequestSuccess
    (state, partialState): State => ({
      ...state,
      loaded: true,
      loading: false,
      success: {
        ...state.success,
        ...partialState
      }
    })
  ),

  on(
    fromApiActions.loadRequestFail,
    (state): State => ({
      ...state,
      loaded: false,
      loading: false
    })
  )
);

我有一个loading从状态中选择的选择器。在引导应用程序时，我正在调度LoadRequest变为loadingtrue 的操作。

这是我的守卫：

export class CanActivateChildrenGuard implements CanActivateChild {
  constructor(private store: Store<fromDataUserInformations.State>) {}

  canActivateChild(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean> | Promise<boolean> | boolean {

    return this.store.pipe(
      select(fromDataUserInformations.isLoading),
      // what to use here?
    );

  }

}

我无法让守卫等待LoadRequestSuccess执行（这是在LoadRequest效果中）以便转向loading，false这样我就可以返回!loading我猜想的东西。

谢谢！

Answer 1

return this.store.pipe(
      select(fromDataUserInformations.isLoading),
      skipWhile(flag => !flag),
      skipWhile(flag => flag),
      mapTo(true),
    );

它一直等到fromDataUserInformations.isLoading为真，然后等到fromDataUserInformations.isLoading再次为假，然后用真释放守卫（意味着允许导航）。