如何在NGRx中提取GET响应对象内的ReceivingObject数组？

首先，你需要先定义一个对应接口返回结构的类型，因为当前接口返回的是包含ReceivingObject数组的对象，而非直接返回数组：

// 新增响应结构接口
interface ReceivingResponse {
  receivingObject: ReceivingObject[];
}

然后修改service中的fetchAll方法，先获取完整响应对象，再通过map操作符提取内部的数组，这样就能返回Observable<ReceivingObject[]>类型：

// 修改后的service方法
fetchAll(): Observable<ReceivingObject[]> {
  return this.http.get<ReceivingResponse>(this.url).pipe(
    map(response => response.receivingObject), // 提取目标数组
    fetchDelay()
  );
}

接下来修正Effects代码里的错误：在map操作中应该派发fetchAllSuccess action，而非fetchAll：

// 修改后的Effects片段
fetchAll$ = createEffect(() =>
  this.actions.pipe(
    ofType(Actions.fetchAll),
    switchMap(() => {
      return this.service.fetchAll().pipe(
        map((receivingObject) => Actions.fetchAllSuccess({ receivingObject })), // 改为fetchAllSuccess
        catchError(mapAsFailure(Actions.failure))
      );
    })
  )
);

最后统一Reducer中的action名称（当前Reducer里的action名称和你定义的Actions不匹配）：

// 修改后的Reducer代码
export const reducer = createReducer(
  initialState,
  on(Actions.fetchAll, (state) => ({ ...state, loading: true })), // 匹配Actions中的fetchAll
  on(Actions.fetchAllSuccess, (state, { receivingObject }) => { // 匹配Actions中的fetchAllSuccess
    return adapter.setAll(receivingObject, {
      ...state,
      loading: false,
      loaded: true,
    });
  })
);

完成以上修改后，service就能正确返回ReceivingObject[]类型的Observable，后续NGRx的数据流也能正常处理这个数组。

内容的提问来源于stack exchange，提问作者Lucindor