Angular> = 4.3,httpClient.get params为空

Question

我正在尝试将Http请求迁移到HttpClient请求.我能够迁移我的post查询但我在迁移get查询时遇到问题.当我这样做时,我的后端没有分别收到任何参数,它告诉我没有提供参数并且为空.

我做错什么了吗？

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

constructor(private httpClient: HttpClient) {}

findItems() {
   let params: HttpParams = new HttpParams();
   params.set('something', 'hello');

   this.httpClient.get<any[]>('http://localhost:3000/apath/', {params})
    .subscribe((results: any[]) => {
      console.log(results);
    }, (errorResponse: any) => {
       console.error(errorResponse);
    });
}

任何的想法？

Answer 1

目前HttpParams是不可变的,你应该设置params如下:

// for set method
let params: HttpParams = new HttpParams().set('something', 'hello');
// for append method
let params: HttpParams = new HttpParams().append('something', 'hello');

的HttpParams的set和append方法,将覆盖原始params实例与最新更新一个由set和append,最后返回新的实例.

所以我们可以在多行中完成,如下所示:

let params: HttpParams = new HttpParams();
params = params.set('something', 'hello');          
params = params.append('something2', 'hello2');

Plunker演示

重要:

从Angular v5.0.0开始,您可以使用fromObjectfrom HttpParamOptions来同时添加多个参数.

const param = new HttpParams({fromObject: {aaa: '1', bbb: '222'}});

您也可以直接object为HttpClient方法设置参数

const obj = {aaa: '1', bbb: '222'};
this.http.get('test', { params: obj}).subscribe();

请参阅演示,第二种方法,请检查浏览器的网络以确认参数已成功添加.