从Angular 8应用程序中的效果访问状态

时间:2019-10-24 18:22:40

标签: angular ngrx

我正在与Metronic合作,Metronic是一个用Angular编写的入门/管理网站。

我想做的是使用经过身份验证的用户ID加载一组特定的数据。

这是我的效果:

@Injectable()
export class ProjectEffects {

    @Effect()
    loadAllProjects$ = this.actions$
        .pipe(
            ofType<AllProjectsRequested>(ProjectActionTypes.AllProjectsRequested),
            withLatestFrom(this.store.pipe(select(allProjectsLoaded))),
            filter(([action, isAllProjectsLoaded]) => !isAllProjectsLoaded),

            mergeMap(() => this.projectService.getProjectsByOwnerId(4)),

            map(result => {
                return new AllProjectsLoaded({projects: result});
            }),
            catchError(error => {
                console.debug("error [%s]", error); 
                return of({ results: null });
            })      
          );

    @Effect()
    init$: Observable<Action> = defer(() => {
        return of(new AllProjectsRequested());
    });

    constructor(private actions$: Actions, private projectService: ProjectService, private store: Store<AppState>) { }

}

这是我的选择器:

export const currentUser = createSelector(
    selectAuthState,
    auth => auth.user
);

我遇到的麻烦是如何从商店中获取当前用户并将user.id值传递到this.projectService.getProjectsByOwnerId(n)。

我尝试了

的多种组合
  

this.user $ = this.store.pipe(select(currentUser))

并在没有任何运气的情况下订阅可观察的东西。

以同步方式从商店访问currentUser的“正确”方法是什么?

1 个答案:

答案 0 :(得分:1)

您很亲密,可以像使用withLatestFrom一样使用allProjectsLoaded

一个例子:

@Effect()
getOrder = this.actions.pipe(
  ofType<GetOrder>(ActionTypes.GetOrder),
  withLatestFrom(action =>
    of(action).pipe(
      this.store.pipe(select(getOrders))
    )
  ),
  filter(([{payload}, orders]) => !!orders[payload.orderId])
  mergeMap([{payload}] => {
    ...
  })
)

有关更多信息,请参见https://timdeschryver.dev/posts/start-using-ngrx-effects-for-this#4-using-a-selector-inside-your-effects