Angular的get传递多参数问题

楼主在自学Angular5的时候发现,新版的Angular已经丢弃http的形式改用Httpclient。但是在demo中发送http.get请求并传递多参数的时候发现,参数params如果是HttpParams类型的话,只能传递单参数,传递多参数要么被覆盖要么无法传递(不清楚是我自己代码问题还是啥),后面查看client.ds.ts中对params的声明,发现params除了可以传递HttpParams外,还可以直接传递JSON或者string类型。所以,楼主就自己简单了写了一个实现JSON传输的方法,可支持单复参数。

export class ProductSearchParames {
  constructor(
    public title: string,
    public price: number,
    public category: string
  ) {
  }
}
  public encodeParams(params: ProductSearchParames) {
    return Object.keys(params)
      .filter(key => params[key])
      .reduce((json: any, key: string) => {
        json[key] = params[key];
        return json;
      }, []);
  }

  search(params: ProductSearchParames): Observable<any> {
    return this.http.get('/api/products', {params: this.encodeParams(params)});
  }
在本地测试,可以正常传输参数,并且后台亦可正常接收

猜你喜欢

转载自blog.csdn.net/QiZi_Zpl/article/details/79740553
今日推荐