在地图工作时使用 switchMap 分派操作失败

Using switchMap to dispatch an action fails while map works

我刚开始使用 ngrxngrx/effects.

在以下代码中,使用 switchMapconcatLatestFrom 获取结果并在使用 map 时分派操作失败。 这是为什么??

使用 switchMap 根本无法编译,当我将鼠标悬停在它上面时,它显示

Argument of type '([action, staff]: [{ per_page: number; } & TypedAction<"[Admin] Fetch All Staff From Store">, Staff[]]) => ({ per_page: number; } & TypedAction<"[Admin] Get All Staff Start">) | { ...; }' is not assignable to parameter of type '(value: [{ per_page: number; } & TypedAction<"[Admin] Fetch All Staff From Store">, Staff[]], index: number) => ObservableInput'. Type '({ per_page: number; } & TypedAction<"[Admin] Get All Staff Start">) | { type: string; }' is not assignable to type 'ObservableInput'. Type '{ per_page: number; } & TypedAction<"[Admin] Get All Staff Start">' is not assignable to type 'ObservableInput'. Property '[Symbol.iterator]' is missing in type '{ per_page: number; } & TypedAction<"[Admin] Get All Staff Start">' but required in type 'Iterable'.ts(2345)

我不明白。

这会出错。

GetAllStaffFromStore = createEffect(() =>
    this.action$.pipe(
      ofType(adminActions.FetchAllStaffFromStore),
      concatLatestFrom((action) =>
        this.store.select(fromAdminReducer.selectStaff)
      ),
      switchMap(([action, staff]) => {
        if (staff.length === 0) {
          return adminActions.GetAllStaffStart({ per_page: action.per_page });
        } else {
          return {
            type: "Getting Staff From Store",
          };
        }
      })
    )
  );

这有效

GetAllStaffFromStore = createEffect(() =>
    this.action$.pipe(
      ofType(adminActions.FetchAllStaffFromStore),
      concatLatestFrom((action) =>
        this.store.select(fromAdminReducer.selectStaff)
      ),
      map(([action, staff]) => {
        if (staff.length === 0) {
          return adminActions.GetAllStaffStart({ per_page: action.per_page });
        } else {
          return {
            type: "Getting Staff From Store",
          };
        }
      })
    )
  );

switchMap 必须 return 一个新的 Observable

将响应包装在 of 运算符中应该会有所帮助。

import { of } from 'rxjs';

GetAllStaffFromStore = createEffect(() =>
    this.action$.pipe(
      ofType(adminActions.FetchAllStaffFromStore),
      concatLatestFrom((action) =>
        this.store.select(fromAdminReducer.selectStaff)
      ),
      switchMap(([action, staff]) => {
        if (staff.length === 0) {
          return of(adminActions.GetAllStaffStart({ per_page: action.per_page }));
        } else {
          return of({
            type: "Getting Staff From Store",
          });
        }
      })
    )
  );