Angular 5新的不可变HttpClient破坏了动态URL参数

Question

我在Typescript中没有过多地使用免疫表，但新的Angular更新让我陷入了困境。我尝试用新的Httplib更新我自己的Http服务。现在，我无法将url参数动态添加到HttpGET请求中。

此处对该问题进行了解释：https://medium.com/spektrakel-blog/angular-httpclient-enforces-immutability-dad161d8714b

我有一个简单的函数，它应该处理不同的动态添加方式，通过传递一个泛型对象或同时具有"key"one_answers"value"属性的对象。它看起来像这样：

public setParams(reqOptions) {
let params;
if (reqOptions) {
if (reqOptions.key && reqOptions.value) {
params = new URLSearchParams;
params.append(reqOptions.key, reqOptions.value);
} else {
params = new URLSearchParams;
for (let item in reqOptions) {
if (reqOptions.hasOwnProperty(item)) {
params.append(item, reqOptions[item]);
}
}
}
}
return params;
}

有没有办法用免疫表重新创建这个功能？

所以如果我有一个像这样的物体

{
status: 'new',
per_page: 50,
page: 0
}

我把上面的函数叫做

listShipments(reqOptions?): Observable<any> {
let params = this.setParams(reqOptions);
return this.http.get(this.baseUrl + '/shipments', {params: params})
.map(this.extractData);
}

它会将请求url重写为

shipments?status=new&per_page=50&page=0

我发现这太有用了，因为我可以很容易地在调用的同时传递一组动态参数。我怎么能用免疫球重建这个？

(顺便说一句：对于"非破坏性"来说，切换到免疫表在这种情况下更新似乎并不重要)

Answer 1

因为HttpClient参数、头等都是不可变的，所以每次尝试修改时，都会返回一个全新的对象。这意味着您必须捕获这个新的引用，才能使更改持久化。你的新功能看起来像这样：

setParams(reqOptions:any){
let params = new HttpParams();
if(!reqOptions) return params;
if(reqOptions.key && reqOptions.value){
return params.set(reqOptions.key, reqOptions.value);
}
for(let key of Object.keys(reqOptions)){
params = params.set(key,reqOptions[key]);
}
return params;
}