httpParams 删除未定义的参数

Question

我需要在 URL 中发送参数以从服务器获取过滤后的数据。

我这样设置参数

const queryParams = new HttpParams(
      {
        fromObject: {
          page: this.paginator.pageIndex.toString(),
          pageSize: this.paginator.pageSize.toString(),
          search: this.searchKey,
          sortBy: this.selectedFilterByStatusValue,
          sortByType: this.selectedFilterSortByValue
        }
      });

并为我服务

 getData(params: HttpParams) {
    return this.apiService.get<IResponseList<IData>>(`${this.url}/list`, params);
  }

问题是，当未选择某些过滤器时，因为我不需要它们，并且它设置为未定义，但这是不正确的......我需要删除未定义的参数。

这里是console.log为了queryParams

cloneFrom: null
encoder: HttpUrlEncodingCodec {}
map: Map(5)
  [[Entries]]
  0: {"page" => Array(1)}
  1: {"pageSize" => Array(1)}
      key: "pageSize"
      value: ["3"]
  2: {"search" => Array(1)}
  3: {"sortBy" => Array(1)}
  4: {"sortByType" => Array(1)}

我尝试使用.set("page", this.paginator.pageIndex)and.append(...)但我总是得到相同的结构

另外，我尝试直接在服务中修复此问题，但这不起作用，我再次得到undefined

this.httpClient.get(`${this.url}/list`, { 
  params: Object.entries(queryParameterObject).reduce((queryParams, [key, value]) => queryParams.set(key, value), new HttpParams());
});

谢谢

Answer 1

尝试在 中跳过它们reduce。

this.httpClient.get(`${this.url}/list`, { 
  params: queryParameterObject ? queryParameterObject.keys().reduce((queryParams, key) => {
  // getting value from map
  let value: any = queryParameterObject.get(key);

  // extracting value if it's an array
  value = Array.isArray(value) ? value[0] : value;

  // adding only defined values to the params
  if (value !== undefined && value !== null) {
    queryParams[key] = value;
  }

  return queryParams;
}, {}) : {};
});