angular - 如何在 Angular 的 http GET 请求中传递多个参数？

Question

我正在使用以下方法在 http get 请求中传递多个参数，但它给我一个错误 -

import { HttpParams, HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) { }

let params = new HttpParams();
params = params.append('var1', val1);
params = params.append('var2', val2);

this.http.get(StaticSettings.BASE_URL, {params: params}).subscribe(...);

错误 - 无法重新声明 block 作用域变量“params”

如果我更改名称，那么如何在 URL 中调用它？

作为一种解决方法，我考虑直接在 URL 中附加参数，而不是如下 -

this.params1 = 'parameter1';
this.params2 = 'parameter2';
this.params3 = 'parameter3';

http请求-

return this.http.get('URL/json?'+'&parameter1='+this.params1+'&parameter2='+this.params2+'&parameter3='+this.params3)

我得到了这个错误 -

在 'URL/json?'+'&parameter1='+this.params1+'&parameter2='+this.params2+'&parameter3='+this.params3' 从 origin 'http://localhost' 访问 XMLHttpRequest :4200' 已被 CORS 策略阻止:请求的资源上不存在“Access-Control-Allow-Origin” header 。

为了检查 URL 是否被正确附加，我点击了错误中的 url，它工作正常。

谁能帮我解决这个问题？

谢谢!!

Answer 1

可以发送参数:

const params = new HttpParams()
   .set('p1', 'one!')
   .set('para2', "two");

和

this.httpClient.get<any>(yoururl,{params}) // {params} short form of {params:params}

您的代码看起来不错，也许您遇到了 cors 问题:什么是 StaticSettings.BASE_URL？ http 还是 https？还是相对 URL？