根據效果驗證，取消ngrx效果服務調用的更好方法是什么？

Question

我有這個ngrx效果，在此示例中正在調用電影服務，但取決於值選擇器，如果此值符合驗證中的預期，則該效果會發送新操作，因此我避免調用該服務，因為條件。 現在，由於此錯誤，我無法在if塊中使用其他操作（這將更具描述性）：

類型“可觀察”不能分配給類型“可觀察| （（... args：any []）=>可觀察）'。

類型“可觀察”不能分配給類型“可觀察” .ts（2322）。

有什么更好的方法來處理這種情況？

loadMovies$ = createEffect(() => this.actions$.pipe(
        ofType('[Movies Page] Load Movies'),
        concatMap(action => of(action).pipe(withLatestFrom(this.store.select(getBlockBuster)))),
        mergeMap(([{payload}, foundBlockBuster]) => {
            if (!foundBlockBuster) {
                // in order to avoid errors we need to use this({ type: '[Movies API] Movies Loaded Success', payload: movies }))
                return of({ type: '[Movies] The block busters are rent' })
            }
            return this.moviesService.getAll()
                .pipe(
                    map(movies => ({ type: '[Movies API] Movies Loaded Success', payload: movies })),
                    catchError(() => of({ type: '[Movies API] Movies Loaded Error' }))
                )
            })
        )
    );

Answer 1

發生此錯誤的原因是，您應該返回Observable<action>而您的代碼將返回兩種類型的對象常量（假定為Action類型），一種僅具有type屬性，而另一種具有type和payload 。 要解決此錯誤，請使用Action數組，然后將對象文字推入該數組，然后返回該數組，如下所示：

loadMovies$ = createEffect(() => this.actions$.pipe(
        ofType('[Movies Page] Load Movies'),
        concatMap(action => of(action).pipe(withLatestFrom(this.store.select(getBlockBuster)))),
        mergeMap(([{payload}, foundBlockBuster]) => {

            const actions = new Array<Action>();

            if (!foundBlockBuster) {
                actions.push({ type: '[Movies] The block busters are rent' });
                return actions;                
            }
            return this.moviesService.getAll()
                .pipe(
                    mergeMap(movies => {
                      actions.push({ type: '[Movies API] Movies Loaded Success', payload: movies });
                      return actions;
                    }),
                    catchError(() => {
                      actions.push({ type: '[Movies API] Movies Loaded Error' });
                      return actions;
                    })
                )
            })
        )
    );

另外，您可以像這樣將對象文字類型轉換為<Action> ：

<Action>{ type: '[Movies] The block busters are rent' }

但是我更喜歡使用數組，因為如果我的應用程序邏輯需要的話，數組允許調度多個動作。

希望能幫助到你。