产品构建中未显示 Angular HttpClient 查询参数答案

【问题标题】：Angular HttpClient query parameters not showing in prod build产品构建中未显示 Angular HttpClient 查询参数
【发布时间】：2019-04-20 20:09:02
【问题描述】：

我有一个奇怪的问题，我的 get 请求的查询参数在 prod 构建中不起作用，但在开发构建中起作用。

首先我使用的是 HttpModule，我升级到了 HttpClientModule，希望可以解决问题。但遗憾的是没有成功。

在切换到 HttpClient 时，我首先遇到了嵌套对象未正确传递的问题。我通过对所有嵌套对象进行字符串化来解决此问题。

不过，使用 prod 构建时没有传递查询参数的问题仍然存在。

这是我在将数据传递给 HttpParams 之前用来对数据进行字符串化的方法：

stringifyObjects() {
  for (var prop in this) {
    let isObject = typeof this[prop] === 'object' && this[prop] !== null

    if(isObject) {
      this[prop] = JSON.stringify(this[prop]) as any;
    }
  }
}

这是我用来将参数传递给请求的代码

let params = new HttpParams({
  fromObject: data
})

this.http.get(url, {params: params, headers: headers})

另外，我尝试单独附加每个参数：

let httpParams = new HttpParams();

Object.keys(data).forEach(function (key) {
  httpParams = httpParams.append(key, data[key]);
});

return this.http.get(url, {params: httpParams, headers: headers})

结果都一样。

其他遇到此问题的人，或知道可能导致此问题的原因的人吗？

提前致谢。

编辑

我添加了这一行来检查问题的开始。

console.log('params.toString()', params.toString());

发现 this params.toString() 返回一个空字符串（而在开发版本中，这会正确返回字符串）。我的方法是手动将字符串添加到 url，而不是作为参数传递。

不过，我还没有找到解决此问题或解决此问题的方法。

【问题讨论】：

参数和查询参数对于角度是不同的。我不确定问题是什么以及设置是否是问题。或者，您可以检查 for...in 循环，看看范围解析是否是问题所在。不过这不太可能。我在附加方面遇到了类似的问题。你能检查一下这可能会有所帮助 - stackoverflow.com/questions/45470575/…
构建HttpClient.get()查询参数的最佳工具是字符串模板：.get(`${url}?param1=${param1}&...`)，使用反向引号
@TheBurgerShot 你找到解决方案了吗？我有完全相同的问题。

标签： angular http angular-http angular-httpclient

【解决方案1】：

改为

let params = new HttpParams({ fromObject: data })

使用

let params = { fromObject:data }

或

let params = {};
params['fromObject']=data

这对我有用 - 角度 8.3.26

【讨论】：