Angular 5中HttpParams无法设置值，求排查问题原因

嘿，这个问题我太熟了——你踩中了Angular HttpParams的一个经典坑：它是不可变对象！

核心问题原因 #

你调用params.set('access_token', ...)的时候，这个方法并不会修改你原来声明的params变量，而是会返回一个全新的HttpParams实例（包含你刚添加的键值对）。但你的代码根本没把这个新实例存下来，所以最初创建的空params一直没变，自然调试时看不到任何键值对。

另外我注意到，你的函数参数paramsArray和withToken完全没用到，我一起帮你把这些逻辑补全，写出更完整的实现：

修正后的代码 #

createParams(paramsArray?: {key: string, value: any}[], withToken: boolean = true): HttpParams {
  let params = new HttpParams();
  
  // 按需添加token
  if (withToken) {
    // 避免localStorage无值时JSON.parse报错
    const currentUser = JSON.parse(localStorage.getItem('currentUser') || '{}');
    // 关键：将set返回的新实例赋值回params
    if (currentUser.token) {
      params = params.set('access_token', currentUser.token);
    }
  }
  
  // 处理传入的参数数组
  if (paramsArray?.length) {
    paramsArray.forEach(({key, value}) => {
      // 统一转成字符串，避免HttpParams接收非字符串值的问题
      params = params.set(key, String(value));
    });
  }
  
  return params;
}

额外优化说明 #

• 增加了localStorage.getItem('currentUser') || '{}'的判断，防止用户未登录时JSON.parse抛出异常
• 对currentUser.token做了存在性校验，避免添加无效的空token参数
• 补全了paramsArray的处理逻辑，支持批量添加参数
• 给withToken设置了默认值，调用时可以灵活选择是否携带token

内容的提问来源于stack exchange，提问作者Marc Rasmussen