如何映射或访问Observable数组（HTTP请求）输入并关联原始myItem

这个问题很常见——当你批量执行请求但没把原始上下文和返回数据绑定在一起时，就会出现这种对应不上的情况。这里有个简单直接的解决方案：

核心思路是在每个请求的Observable流中，把原始的myItem和请求返回的数据包装成一个对象，这样后续处理时就能同时拿到两者，自然就能对应上了。

步骤1：改造请求生成逻辑 #

原来你是直接返回HTTP请求的Observable，现在我们用map操作符，把返回数据和原始item合并：

// 假设你用的是RxJS 6+，使用pipe和map
const batchOfRequests = myItemsArray.map(item => {
  // 生成你的HTTP请求Observable
  return http.get(`/api/your-endpoint?prop1=${item.propertyOne}&prop2=${item.propertyTwo}`)
    .pipe(
      // 把原始item和返回数据包装成一个对象
      map(responseData => ({
        originalItem: item,
        response: responseData
      }))
    );
});

步骤2：保持concat执行逻辑不变 #

继续用concat依次执行请求，现在subscribe里拿到的结果会包含原始item：

concat(...batchOfRequests).subscribe(result => {
  // 现在可以直接访问原始item和对应的数据了
  console.log("对应原始Item:", result.originalItem);
  console.log("请求返回的数据:", result.response);
  
  // 这里可以根据originalItem的属性做后续处理，比如更新UI或者关联数据
});

可选：处理请求错误场景 #

如果担心某个请求失败导致流程中断，或者需要知道哪个item的请求失败了，可以加入catchError操作符，把错误信息也和原始item绑定：

import { of } from 'rxjs';
import { map, catchError } from 'rxjs/operators';

const batchOfRequests = myItemsArray.map(item => {
  return http.get(`/api/your-endpoint?prop1=${item.propertyOne}&prop2=${item.propertyTwo}`)
    .pipe(
      map(responseData => ({
        originalItem: item,
        response: responseData,
        error: null
      })),
      catchError(err => of({
        originalItem: item,
        response: null,
        error: err
      }))
    );
});

这样即使某个请求失败，你也能清楚知道是哪个myItem对应的请求出了问题，不会中断整个批量流程。

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