Angular 多个休息 api 请求答案

【问题标题】：Angular multiple rest api requestAngular 多个休息 api 请求
【发布时间】：2018-11-26 15:34:37
【问题描述】：

我是 Angular 新手，有一个问题。我需要调用 2 API Rest，在第二个 API 上我需要第一个 API 的结果。我有这个代码：

ngOnInit() {

    this.Jarwis.getmyinfo()
    .subscribe(
        // data => console.log(data),
        data => this.Getmyinfo = data,
        error => console.log(error),
    );

    this.Jarwis.showazienda(id_azienda).subscribe(
        // data => console.log(data),
        data => this.Showazienda = data,
        error => console.log(error),
    );
}

这是对 Jarwis 中的 API REST 的调用：

getmyinfo(): 可观察的 { 返回 this.http.get(${this.baseUrl}/me); }

showazienda（数据）：可观察的 { 返回 this.http.get(${this.baseUrl}/showazienda/ + 数据); }

getmyinfo 是第一个 HTTP 请求，我需要为第二个 HTTP 请求获取 id_azienda (showazienda)

我认为需要在 json 中映射第一个 http 请求的结果并获得 id_azienda 的结果，但我无法做到。

如果我在 showazienda 的参数中设置 1，我就可以获取并显示 API 的信息。

【问题讨论】：

标签： angular5

【解决方案1】：

对于 observable，您使用“.flatMap”将多个异步操作链接在一起（这与 promise 的“.then”非常相似）。 flatMap 允许您用于将多个异步请求链接在一起并让它们按顺序执行。

Here 是对 flatMap 的一个很好的解释。

所以对于你的例子，你会做这样的事情：

ngOnInit() {
    this.Jarwis.getmyinfo()
    .flatMap(
        (data) => {
            this.Getmyinfo = data;
            // get id_azienda from data
            return this.Jarwis.showazienda(id_azienda);
        }
    ).subscribe(
        // data => console.log(data),
        data => this.Showazienda = data,
        error => console.log(error),
    );
}

此示例代码将首先发送“getmyinfo()”请求。收到响应后，将使用从“getmyinfo()”接收的数据调用“.flatMap”。然后，您可以使用此数据获取“id_azienda”。然后您可以向“showazienda”发出第二个请求。从“showazienda()”返回的 observable 需要在 flatMap 中返回。然后您订阅修改后的 observable，您收到的数据将是“showazienda()”请求的结果。

【讨论】：