如何从ngrx效果到服务函数传递两个不同的状态?

时间:2020-02-12 21:58:23

标签: angular rxjs ngrx ngrx-effects

我有一个effect函数,我试图将数据从我的分派操作以及一个单独的选择器传递给服务中的函数,但是我迷失了RXJS语法。我敢肯定我没有正确映射数据。请查看相关代码。

//效果

 updateCohort$ = createEffect(() =>
    this.actions$.pipe(
        ofType(getCohortActions.updateActiveCohort.type),
        withLatestFrom(this.store.pipe(select(activeCohort))),
        map(([action, selector ]) => (
            this.cohortFeaturesServices.updateCohorts(action, selector)
        )),

//服务

public updateCohorts(action, selector): Observable<any> {
    const url = `api/services/cohorts/frontend/`;

    return this.http.patch(`${url}/${selector.id}/`, action.changes);
}

Visual Studio Code强调了整个功能,并且在控制台中出现以下错误。

类型“可观察>”不能分配给类型“可观察”。 属性“类型”在“可观察”类型中丢失,但在“操作”类型中是必需的。

如何解决效果并成功将操作和选择器传递给服务电话?

2 个答案:

答案 0 :(得分:1)

您需要使用switchMap/mergeMap/concatMap/exhaustMap将来自HTTP服务的可观察到的东西“解包”-> switchMap-> map的结果放入 action 中,例如您的效果必须返回动作(例如,这只是动作分派的默认效果)。

此外,我建议API方法将更改作为参数而不是操作。

updateCohort$ = createEffect(() =>
  this.actions$.pipe(
    ofType(getCohortActions.updateActiveCohort.type),
    withLatestFrom(this.store.pipe(select(activeCohort))),
    switchMap(([action, cohort]) =>
      this.cohortFeaturesServices.updateCohorts(action.changes, cohort)
    ),
    map((result: CohortUpdateResponse) => successCohortUpdateAction())
  )
)


public updateCohorts(changes: Partial<Cohort>, cohort: Cohort): Observable<CohortUpdateResponse> {
  const url = `api/services/cohorts/frontend/`;

  return this.http.patch(`${url}/${cohort.id}/`, changes);
}

类似这样的东西。

P.S。添加了一些“已发明”类型以显示正在发生的事情和发生的地方

P.S.S没有检查代码中的拼写错误,而是直接在答案窗口中写了答案

GL:)

答案 1 :(得分:0)

对于其他任何人,他们可能也会遇到我发现的同一问题。我没有退货。

updateCohort$ = createEffect(() =>
    this.actions$.pipe(
        ofType(getCohortActions.updateActiveCohort.type),
        withLatestFrom(this.store.pipe(select(activeCohort))),
        exhaustMap(([action, cohort]) => this.cohortFeaturesServices.updateCohorts(action, cohort).pipe(

        )),
        map((response) => ({
            type: getCohortActions.updateActiveCohortSuccess.type, // success action
            success: response
        })),
        catchError((err) => of(getCohortActions.updateActiveCohortError(err))) // error action
    )
)