Question

这是我打算做的事。

请求https://reqres.in/api/users/2

发送如下响应。

{
  "data": {
    "id": 2,
    "first_name": "Janet",
    "last_name": "Weaver",
    "avatar":
      "https://s3.amazonaws.com/uifaces/faces/twitter/josephstein/128.jpg"
  }
}

现在，我想抓住头像网址并提出另一个请求，这会给我二进制图像。

最后，我想要输出的是Observable，它为我提供了这些数据。

{
  "data": {
    "id": 2,
    "first_name": "Janet",
    "last_name": "Weaver",
    "avatar":
      "BINARY_GIBBERISH HERE"
  }
}

以下是我的接触方式，但无法完成。

this.http
  .get('https://reqres.in/api/users/2')
  .switchMap(a => {
    const image$ = this.http.get(a.json().data.avatar);
    const data = Observable.of(a.json().data);
    // Do something here to combine.
  })
  .subscribe(a => {
    // get data here.
  });
}

基本上，有没有办法建立这样的结构，

{
  "data": {
    "id": 2,
    "first_name": "Janet",
    "last_name": "Weaver",
    "avatar": [Observable from this.http.get]
  }
}

然后解决了我的最终数据？

Answer 1

您无需使用switchMap，而是使用concatMap或mergeMap代替：

this.http
  .get('https://reqres.in/api/users/2')
  .concatMap(a => {
    const data = a.json().data;
    const image$ = this.http.get(data.avatar);

    return image$.map(imageData => {
      data.avatar = imageData;
      return data;
    });
  })
  .subscribe(a => {
    // get data here.
  });
}

来自Angular中嵌套http请求的嵌套Observable

以下是我的接触方式，但无法完成。

1 个答案: