Question

我正在尝试设计一个ngrx效果，它将通过对象列表进行查看。如果此列表中有一个ID，则需要使用新ID更新减速器并导航至新路线。

如果ID不在列表中，则只需导航到新路线即可。此条件路径有效。 NavigateToNewApp（newPath）将成功路由到新路径。

（concatMap）的返回，需要触发两个操作-SetThingIdSuccess和NavigateToNewInternalApp不起作用。我得到：UserEffects.setAppContext" dispatched an invalid action: {"_isScalar":true}。如果我不考虑的话，它就是不确定的。

是否有更好的架构方法？从ngrx中的条件语句发送多个效果的最佳方法是什么？

@Effect()
setAppContext = this.actions$.pipe(
  ofType(UserActionTypes.DoAPermittedThing),
  withLatestFrom(
    this.store$.select(getPermittedThingIDs),
    this.store$.select(getPermittedThings)
  ),
  map(([thingID, permittedThingIDs, permittedThings]) => {
    if (permittedThingIDs.find(id => (thingID as any).payload === id) < 0) {
      const newPath = permittedThings[0].Path;
      return new NavigateToNewApp(newPath);
    }
    return of(
      concatMap(() => {
        const currentId = (thingID as any).payload as number;
        return [new SetThingIdSuccess(currentId), new NavigateToNewInternalApp()];
      })
  })
);

Answer 1

奥斯丁在Dispatching Multiple Actions from NGRX Effects

中写道

我们该如何解决？让我们打破switchMap返回一个新的可观察的数组，具有多个动作！

@Effect() save = this.update$.pipe(
   map(action => action.payload),
   switchMap(payload => this.myService.save(payload)),
   switchMap(res => [
       new Notification('save success'),
       new SaveSuccess(res)
   ])
);

就您而言，我认为您不应该使用map，而应该使用concatMap并始终返回包含操作的数组。

Answer 2

我建议以这种效果，如果需要设置，请返回SetThingIdSuccess动作，然后为SetThingIdSuccess创建一个返回NavigateToNewInternalApp的新效果。不必在相同的效果内发生，导航是成功操作的副作用，因此有必要将其突破。

调度多个条件操作

2 个答案: