问将参数添加到有效的选择器中
EN

Stack Overflow用户

提问于 2019-06-02 00:12:37

回答 1查看 505关注 0票数 0

我有以下几点

  createMission$ = this.actions$.pipe(
    ofType<featureActions.CreateMissionRequest>(featureActions.ActionTypes.CreateMissionRequest),
    withLatestFrom(this.store$.select(MissionsStoreSelectors.getById(), {id : action.payload.routeId}))
    switchMap((action) =>
      this.dataService.createMission(action.payload.mission).pipe(
        map(response => new featureActions.CreateMissionSuccess({response, mission : action.payload.mission})),
        catchError((error: HttpErrorResponse) => {
          this.snackBar.open(this.translate.instant('ERROR.HTTP.GENERIC'), this.translate.instant('BUTTON.OK'), {duration: 2500});
          return of(new featureActions.CreateMissionFailed({error}));
        }),
      ),
    ),
  );

问题是，在withLatestFrom中，我希望在选择器中使用一个参数，这个参数来自于操作。我怎样才能做到这一点？

    withLatestFrom(this.store$.select(MissionsStoreSelectors.getById(), {id : action.payload.routeId}))
    switchMap((action, valueFromLatest) =>

编辑:我试过了

  @Effect()
  createMission$ = this.actions$.pipe(
    ofType<featureActions.CreateMissionRequest>(featureActions.ActionTypes.AssignMissionRequest),
    withLatestFrom((action) => this.store$.select(MissionsStoreSelectors.getById(), {id : action.payload.routeId})),
    switchMap((mission, action) =>
      this.dataService.createMission(action.payload.mission).pipe(
        map(response => new featureActions.CreateMissionSuccess({response, mission : action.payload.mission})),
        catchError((error: HttpErrorResponse) => {
          this.snackBar.open(this.translate.instant('ERROR.HTTP.GENERIC'), this.translate.instant('BUTTON.OK'), {duration: 2500});
          return of(new featureActions.CreateMissionFailed({error}));
        }),
      ),
    ),
  );

但是我在action.payload上有类型错误(动作变成了一个数字)似乎不起作用

store

ngrx

angular

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-06-02 00:43:22

您可以使用switchMap和combineLatest来实现这一点，但是在您的代码中还没有看到您想要使用选择器的结果(来自选择器的数据)。我假设原始操作(CreateMissionRequest)在其有效负载中有两个属性：routeId和mission。但是它没有任何意义，因为您使用选择器，并且不再使用它的结果。但是你可以从下面的技术中得到一个整体的想法，然后做你想做的任何事情。

更新

createMission$ = this.actions$.pipe(
    ofType<featureActions.CreateMissionRequest>(featureActions.ActionTypes.CreateMissionRequest),
    // This is where you use the switchMap
    switchMap((action) =>
        // combineLatest here makes it possible to pass forward the results
        // from the selector and the original action if you need
        combineLatest([ 
          this.store$.pipe(select(MissionsStoreSelectors.getById(), {id : action.payload.routeId}),take(1)),
          of(action.payload.routeId),
        ])),
    switchMap(([mission,routeId]) =>
      this.dataService.createMission(mission).pipe(
        map(response => new featureActions.CreateMissionSuccess({response, mission})),
        catchError((error: HttpErrorResponse) => {
          this.snackBar.open(this.translate.instant('ERROR.HTTP.GENERIC'), this.translate.instant('BUTTON.OK'), {duration: 2500});
          return of(new featureActions.CreateMissionFailed({error}));
        }),
      ),
    ),
  );

事实上，如果您只需要将一个可观察到的转换为另一个，switchMap可以为您完成这项工作，所以不需要combineLatest

createMission$ = this.actions$.pipe(
    ofType<featureActions.CreateMissionRequest>(featureActions.ActionTypes.CreateMissionRequest),
    switchMap((action) =>  
        this.store$.pipe(select(MissionsStoreSelectors.getById(), {id : action.payload.routeId}),take(1))),
    switchMap((mission) =>
      this.dataService.createMission(mission).pipe(
        map(response => new featureActions.CreateMissionSuccess({response, mission})),
        catchError((error: HttpErrorResponse) => {
          this.snackBar.open(this.translate.instant('ERROR.HTTP.GENERIC'), this.translate.instant('BUTTON.OK'), {duration: 2500});
          return of(new featureActions.CreateMissionFailed({error}));
        }),
      ),
    ),
  );