时间戳

首页 > 解决方案 > Angular6 http.get 从调用中提取 id 以在另一个中使用

angular - Angular6 http.get 从调用中提取 id 以在另一个中使用

问题描述

我想调用我的 REST 检查 ServiceProvider ID，然后在另一个调用中使用该 ID。我有一个名为GetServiceProviderId()的方法，它将调用 API 并获得以下 Json 结果： { "mitId": 18, "ServiceProviderId": "2" }

现在我想把 2 放在我的另一个调用中，用 GetInstallation()填充我的列表

这是我当前的代码：

  GetServiceProviderId() {
    return this.http.get<Info>(this.rooturl + 'info', { headers: this.reqHeader }).subscribe(res => {
      res.ServiceProviderId
    })
  }

这就是我想使用 2 的地方：

  GetInstallation() {
    return this.http.get<Installation[]>(this.serviceurl +
      "2"
      , { headers: this.reqHeader })
  }

如果我用 this.GetServiceProviderId() 替换“2”，我会收到以下错误：GET localhost:50159/installation/?serviceproviderid= [object%20Object] 400 (Bad Request)

谢谢阅读

标签： angularrestapitypescript

解决方案

您可以使用平面地图。它会首先调用 GetServiceProviderId()，当它解决时它将调用你的下一个 observable (http get)。当你使用 observables 时，一切都是惰性的，这意味着你没有处理具体的值。在调用 .subscribe() 之前不会执行代码。起初这是一个奇怪的概念，老实说需要时间和练习才能让你的大脑围绕它。

http://reactivex.io/documentation/operators/flatmap.html

 GetServiceProvider() : Observable<Info> {
    return this.http.get<Info>(this.rooturl + 'info', { headers: this.reqHeader });
  }

GetInstallation() : Observable<Installation[]> {
    return this.GetServiceProvider().pipe(
        flatMap(info => {
            // ^^ this info object is the result of GetServiceProviderId()
            return this.http.get<Installation[]>(this.serviceurl +
            info.serviceProviderId
          , { headers: this.reqHeader })
        })
);

编辑：我刚刚意识到您的 GetServiceProviderId() 函数正在调用 http.get 然后订阅。我会重构它并从此方法中删除 .subscribe() 。让消费者将 id 从 info 对象中提取出来。

编辑：此外，如果您可以控制 API，请考虑将其压缩到一个调用中。在这种情况下，您必须从浏览器到 API 进行 2 次往返。即使这意味着从您的服务器调用不同的 WebAPI，因为这很可能会更快。你永远不知道你的用户连接会有多慢，所以对他们来说这两个调用可能需要 5 秒才能运行，但对你来说可能需要 250 毫秒。但是，如果您使用 Server to Server 检索 ServiceProviderId，则调用总共可能只需要 2 秒，因为他们发出的 Web 请求少了一个。

推荐阅读