Angular HttpClient，名称为'query'的参数无法设置

Question

我在Angular服务中有一个params类型的HttpParams变量。

当我这样做

params.set('sortby', sortby.toString());

或

params.set('top', top.toString());

这两种方法都可以正常工作，并被添加到params变量中并传递给API。

但是问题是当我在API中将路由参数定义为'query'时。我不明白为什么我的代码，

params.set('query', query.toString());

根本不起作用。只是不会被添加到参数列表中。我认为这与名称'query'有关。目前无法选择更新API。

有没有办法让'query'工作？

API调用：

尝试直接从chrome控制台更新到请求。即使那样，我也找不到查询参数。

编辑：newParams（）

那将返回带有正确编解码器的HttpParams

protected newParams(): HttpParams {
    return new HttpParams({
      encoder: PARAMETER_CODEC
    });
  }

编码器是，

class ParameterCodec implements HttpParameterCodec {
  encodeKey(key: string): string {
    return encodeURIComponent(key);
  }

  encodeValue(value: string): string {
    return encodeURIComponent(value);
  }

  decodeKey(key: string): string {
    return decodeURIComponent(key);
  }

  decodeValue(value: string): string {
    return decodeURIComponent(value);
  }
}
const PARAMETER_CODEC = new ParameterCodec();

Answer 1

如果您想知道为什么没有传递任何参数，在引用的 HttpParams 文档中会有一个关键提示

  

此类是不可变的-所有变异操作都返回一个新的   实例。

基本上，您应该能够通过像这样链接以发送多个参数来发送参数/查询：

    const params = new HttpParams()
        .set('query', 'value here')
        .set('another_param', 'value_here')
        .set('sortby', sortby.toString());

return this.httpClient.get('my url', { params })

如果您想有条件地附加HttpParams，请改用它的变体，例如：

let params = new HttpParams();
if ( limit ) {
  params = params.set('limit', String(limit));
}
params = params.set('search', keyword);