按有效顺序分派乘法动作 - ngrx

Dispatch multiply actions in order in effect - ngrx

我想知道如何在我的效果中按顺序分派乘法动作。

  @Effect()
  getClients$: Observable<Action> = this.actions$
    .ofType(ClientActions.GET_CLIENTS)
    .withLatestFrom(this.store.select(fromRoot.getClients))
    .filter(([action, clients]) => clients.length === 0)
    .map(action => new LayoutActions.IsLoading(true))
    .switchMap(() => this.clientService.getClients())
    .map(clients => new ClientActions.GetClientsReceived(clients));

在上面的例子中,第一个动作没有被调度。 getClients() 方法和最后一个操作工作正常。

您可以使用 do 运算符。

示例: .do(dispatchAction(...))

您的可观察对象发出的每个动作都将被分派,因此您需要的是将一个动作映射到多个动作。您可以通过在 switchMap() 上使用 startWith() 添加加载操作来做到这一点:

.switchMap(action => {
  this.clientService.getClients()
    .map(clients => new ClientActions.GetClientsReceived(clients) as Action)
    .startWith(new LayoutActions.IsLoading(true))
);

有时输入可能是错误的,typescript 将使用您操作的特定类型而不是 Action。在这种情况下,在地图之后,Observable 被输入为 Observable<ClientActionReceived> 因此在 startWith 中返回一个 LayoutActionLoading 对于打字稿来说似乎是错误的。
为避免这种情况,您需要将两者之一转换为 Action 以便它知道它是 Observable<Action>.

我就是这样做的:

userRoleChange$: Observable<Action> = this.actions$
 .ofType(userActions.USER_SWITCH_ROLE)
 .switchMap(() => Observable.of(
   {type: preFlightActions.PRE_FLIGHT_CLEAR, payload: {}},
   {type: detailPlanningActions.DETAIL_PLANNING_CLEAR, payload: {}},
   {type: uploadsActions.UPLOAD_FILTER_SET, payload: {}}
 ));