以下是效果示例：

Question

我正在使用angular7 + redux。

我想要一个通用功能，它获得一个枚举值列表（一种redux操作，每个枚举都从带有值列表的数据库中读取），然后逐个分发-每个分发都会等到之前的运行完成。

以下是效果示例：

...
@Injectable()
export class MyObjectsEffects {
    @Effect()
    getMyObjects$ = this.actions.pipe(
        map(payload => { // ****** FIRST MAP
            let x = this.store.dispatch(new enumActions.GetEnumsIds("Enum1Types")).pipe(take(1));
            return x;
        }),
        switchMap(payload => { // ***** SECOND MAP
            let x = this.store.dispatch(new enumActions.GetEnumsIds("Enum2Types")).pipe(take(1));;
            return x;
        }),
        switchMap(payload => {
            console.log(payload);
            return this.myDataService.getAll().pipe(
                map(x => 
                    new myObjectActions.GetObjectsDataSuccess(x)
                ),
                catchError(errorMes => of(
                    new myObjectActions.GetMyObjectsDataFail(errorMes)))
                );
        }
        ),
        catchError(() => {
            console.warn('MyObjectEffects error');
            return EMPTY;
        })
    );
}

在枚举中-我也在使用redux功能。

在redux效果中-排气图可观察到的第一个效果返回...

...
@Injectable()
export class EnumEffects {

    @Effect()
    getEnumIds$ = this.actions.pipe(
        ofType<GetEnumsIds>(EnumActionsTypes.GetEnumsIds), //   EnumActionsTypes.GetEnumIds
        exhaustMap(payload => {
            return this.enumDataService.GetEnumIds(payload.enumName).pipe(
                map(enums => 
                    //enums.
                    new enumActions.GetEnumsIdsDataSuccess(enums, payload.enumName)
                ),
                catchError(errorMes => of(
                    new enumActions.GetEnumsIdsDataFail(errorMes)))
                );
        }
        ),
        catchError(() => {
            console.warn('EnumEffects error');
            return EMPTY;
        })
    );
}

以下是enumAction的示例：

...

export enum EnumActionsTypes {
  GetEnumsIds = '[Enum] Get Enums',
  GetEnumsIdsDataSuccess = '[Enum] Get Enums Success',
  GetEnumsIdsDataFail = '[Enum] Get Enums Data Fail',
}

interface ActionEx extends Action {
  enumName: string;
  payload: any;
}

export class GetEnumsIds implements ActionEx {
  public readonly type: string = EnumActionsTypes.GetEnumsIds;
  public readonly payload: any;

  constructor(public enumName: string) { 
  }
}


export class GetEnumsIdsDataSuccess implements ActionEx {
  public readonly type = EnumActionsTypes.GetEnumsIdsDataSuccess;
  constructor(public payload: FoxEnumTypeEx[],
    public enumName: string) {}
}

export type EnumActions = GetEnumsIds | GetEnumsIdsDataSuccess |  GetEnumsIdsDataFail;

在getMyObjects方法中，依次调用第一张地图和第二张地图（用星号标记），但是运行枚举效果时-它对Enum1Types运行一次，但对Enum2Types运行两次。

这是主要的问题-即使我正在对第二个枚举进行一次调度，它也会运行两次enumeffect。

我了解ContactMap，MergeMap，ExhaustMap，SwitchMap，但是我不知道它们与redux的结合是如何实现的（scense后面必须有一个订阅）。

也许我没有正确使用map函数（我尝试了很多组合-大多数是一种组合，但是我已经提到了问题）。

有效的分派方式正确吗？

（它们有时可能是20 enum2，所以代码将非常庞大-我需要首先安排该代码，因此我可以像在此示例中那样调用它吗？

我很高兴有一个很好的，非常紧凑的示例（20个枚举）可以做到这一点。

谢谢。

依次使用redux和angular7进行调度

以下是效果示例：

0 个答案: