如何从 ngrx 7 效果中分派多个动作

Question

想法是监听触发此效果的一个动作，然后进行 returns 数据的服务调用。服务调用成功后，我想分派两个不同的操作。我尝试了很多我在 SO 上发现的不同组合，但其中 none 有效 - 只有第一个动作得到调度，完全忽略第二个。用 switchMap、mergeMap 试过这个，但仍然只有第一个动作被调度。

@Effect()
    getAllShows$ = this.actions$
    .pipe(
        ofType(GetAllShowsAction.GET_ALL_SHOWS),
        switchMap((action: any) => this.showService.getAllShows(action.payload).pipe(
            mergeMap( response => { return [new GetAllShowsAction(action.payload + 1), new GetAllShowsSuccessAction(response)] },
            catchError( error => of(new GetAllShowsErrorAction()))
            )
        )
));

我的应用信息：

Angular CLI: 7.3.6
Node: 10.10.0
OS: darwin x64
Angular: 7.2.10
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.6
@angular-devkit/build-angular     0.13.6
@angular-devkit/build-optimizer   0.13.6
@angular-devkit/build-webpack     0.13.6
@angular-devkit/core              7.3.6
@angular-devkit/schematics        7.3.6
@angular/cli                      7.3.6
@angular/fire                     5.1.2
@ngtools/webpack                  7.3.6
@schematics/angular               7.3.6
@schematics/update                0.13.6
rxjs                              6.4.0
typescript                        3.2.4
webpack                           4.29.0

NgRx 版本 7.3.0.

Answer 1

试试这个：

@Effect()
    getAllShows$ = this.actions$
    .pipe(
        ofType(GetAllShowsAction.GET_ALL_SHOWS),
        switchMap((action: any) => this.showService.getAllShows(action.payload)),
        switchMap(res => [
            new GetAllShowsAction(action.payload + 1),
            new GetAllShowsSuccessAction(response)
        ]),
        catchError( error => of(new GetAllShowsErrorAction()))
);

如何从 ngrx 7 效果中分派多个动作

How to dispatch multiple actions from ngrx 7 effects

angular

typescript

ngrx

ngrx-effects