Angular Http Client - 如何将嵌套参数对象传递给 GET API

Question

我正在使用最新版本的 angular (8)。我正在将我的 Http 请求从原始 http 转换为新的 http 客户端。我正在调用 GET API，我通过以下方式发送嵌套参数:

let data: any = {filters: {"4e9bc554-db54-4413-a718-b89ffdb91c2f": "465c1ab-2b89-4b51-8a7b-5d2ac862ee32"}, is_indexed: true}
return this.httpClient.get<Register[]>('/registers/', {headers: headers, params: data});

上面的代码，嵌套的参数无法识别。如何使用 HttpClient 正确传递嵌套参数？ ps 在旧的Http中，使用上面的代码是没有问题的。提前感谢您的帮助。

更新网址看起来类似于:

https://www.somepapi.com/registers/?filters=%7B%224e9bc554-db54-4413-a718-b89ffdb91c2f%22:%228465c1ab-2b89-4b51-8a7b-5d2ac862ee32%22%7D&is_indexed=true ;

Answer 1

您可以递归地遍历数据对象以将其展平。

getData(data: any) {
  let params = {};    

  this.buildHttpParams(params, data, "");

  return this.httpClient.get("...", {params: params})
}

private buildHttpParams(params: any, data: any, currentPath: string) {
    Object.keys(data).forEach(key => {
        if (data[key] instanceof Object) {
            this.buildHttpParams(params, data[key], `${currentPath}${key}.`);
        } else {
            params[`${currentPath}${key}`] = data[key];
        }
    });
}

这将更改我们的数据对象:

{
  filters: {
    "4e9bc554-db54-4413-a718-b89ffdb91c2f": "465c1ab-2b89-4b51-8a7b-5d2ac862ee32"
  },
  "is_indexed": true
}

到:

{
  "filters.4e9bc554-db54-4413-a718-b89ffdb91c2f": "465c1ab-2b89-4b51-8a7b-5d2ac862ee32",
  "is_indexed": true
}