NGRX 效果中的访问状态

Question

如何在效果中访问我的状态？ 我当前的效果实现（如下所示）在调度SEARCH_REUQUEST操作时触发。 但是，在调用我的搜索服务以启动 HTTP 请求之前，我想访问一个状态以获取一些搜索参数。

@Effect()
SearchRequest$ = this.actions$
  .ofType(fromSearchActions.SearchActionTypes.SEARCH_REQUEST)
  .pipe(
    switchMap((action: fromSearchActions.SearchRequest) => {
      return this.searchService
        .search(action.payload, action.enrichmentId)
        .pipe(
          map(response => {
            console.group("SEARCH effects");
            console.log(response);
            console.groupEnd();
            return new fromSearchActions.SearchRequestSuccess(response);
          }),
          catchError(error =>
            of(new fromSearchActions.SearchRequestFail(error))
          )
        );
    })
  );

显然，我可以在这里利用一个 RxJS 运算符，但我似乎无法理解如何修改现有的效果实现以合并它。

@Effect()
SearchRequest$ = this.actions$
  .ofType(fromSearchActions.SearchActionTypes.SEARCH_REQUEST)
  .withLatestFrom(this.featureStore.select(fromFeature.getCurrentSearchPageOptions))
  .pipe(
      switchMap((// How should this change? //) => { //Error
        return this.searchService
          .search(action.payload, action.enrichmentId, pageOptions)
          .pipe(
            map(response => {
              console.group("SEARCH effects");
              console.log(response);
              console.groupEnd();
              return new fromSearchActions.SearchRequestSuccess(response);
            }),
            catchError(error =>
              of(new fromSearchActions.SearchRequestFail(error))
            )
          );
      })
    )

我觉得我已经接近解决方案了，但我似乎无法在switchMap阶段把它放在一起。

Answer 1

withLatestFrom 绝对是你想要的。 您所要做的就是将响应添加到您在 switchMap 中传递的参数。 像这样（其中 pageOptions 是您从选择器获得的状态切片的类型）：

switchMap(([action, options]: [fromSearchActions.SearchRequest, pageOptions]) => {

那么您可以像以前一样使用action ， options将是您从this.featureStore.select(fromFeature.getCurrentSearchPageOptions)

Answer 2

withLatestFrom：将源 Observable 与其他 Observable 组合以创建一个 Observable，其值由每个 Observable 的最新值计算得出。

您将获得包含两个数据的数组，您可以在https://medium.com/@viestursv/how-to-get-store-state-in-ngrx-effect-fab9e9c8f087 中找到指南

你的代码可能是这样的：

@Effect()
    SearchRequest$ = this.actions.pipe(
        ofType(fromSearchActions.SearchActionTypes.SEARCH_REQUEST),
        withLatestFrom(this.featureStore.select(fromFeature.getCurrentSearchPageOptions)),
        switchMap(([action: Action, pageOptions: YourStateOptions]) => { // <-- pageOptions here
                return this.searchService
                    .search(action.payload, action.enrichmentId, pageOptions)
                    .pipe(
                        map(response => {
                            console.group("SEARCH effects");
                            console.log(response);
                            console.groupEnd();
                            return new fromSearchActions.SearchRequestSuccess(response);
                        }),
                        catchError(error =>
                            of(new fromSearchActions.SearchRequestFail(error))
                        )
                    );
            }
        )
    );