在 RxJS 管道中多次调用 http.get

Question

我需要在唯一的 RxJS 管道中多次处理 http.get 响应。这是 JSON 响应的一部分：

[
  {
    "id": 1,
    "layerName": "Primary",
    "hierarchyCount": 2,
    "layerHierarchies": [
      {
        "hierarchyOrder": 1,
        "id": 3,
        "name": "Secant Piles"
      },
      {
        "hierarchyOrder": 2,
        "id": 6,
        "name": "As-Designed"
      }
    ],
    "gisViewTypeId": "M1",
    "coordinateSystemId": 5,
    "verticalCoordinateSystemId": 7,
    "measurementUnitSymbol": null,
    "color": "#fabed4",
    "stroke": true,
    "weight": 3,
    "opacity": 1,
    "fill": true,
    "fillColor": "#f032e6",
    "fillOpacity": 0.2,
    "active": false,
    "pointTypeId": 2,
    "shiftX": 0,
    "shiftY": 0
  },
...
]

通过以下管道，我得到 hierarchyCount 的最大值如下：

    this.layerHierarchi$ = this.http.get<LayerHierarchiesEntity[]>(baseURL + "Structure/StructureHierarchy", { params: layerParams, headers: headers })
    return this.layerHierarchi$.pipe(
      mergeMap((value) => from(value)),
      pluck("hierarchyCount"),
      max(),
      // mergeMap(maxHierarchyCount => this.layerHierarchi$),
    )

如您所见，在注释的管道的最后一行中，我尝试获取原始 http.get 响应以继续处理。我不确定在 mergeMap 运算符中进行另一个调用是否正确，或者是否有另一种技术或 RxJS 运算符来处理这个问题？换句话说，我需要在整个管道中多次使用原始响应。

Answer 1

如果我对问题的理解正确，我会按照这些思路考虑解决方案。内嵌评论

this.layerHierarchi$ = this.http.get<LayerHierarchiesEntity[]>(baseURL + "Structure/StructureHierarchy", { params: layerParams, headers: headers })
return this.layerHierarchi$.pipe(
  // process the result of the http call and extract within the function passed to mergeMap
  // you should use the map operator
  map((value) => {
      // the following map is the array method, NOT the map rxjs operator
     hierCounts = value.map(v => v.hierarchyCount);
     hierMax = Math.max(...hierCounts)  // assume hierarchyCount is a number
     return [value, hierMax]
  }),
  mergeMap(([value, hierMax]) => // do what you need to do to continue processing),
)

一些额外的注意事项。

您一直在使用 mergeMap 运算符向其传递一个函数，该函数 returns 由 from rxjs 函数创建的 Observable，您向其传递了一个数组。

除非你有充分的理由这样做，否则我更愿意像我的示例一样使用 javascript 数组函数处理数组。

如果在进一步处理过程中需要执行其他级联 http 调用，请考虑使用 concatMap 而不是 mergeMap。您可能会从 rxjs 与 http in this article.

的典型使用模式中找到一些灵感

在 RxJS 管道中多次调用 http.get

Calling http.get multiple times in a RxJS pipeline

angular

rxjs

http-get