Angular中如何将类实例作为参数传递给HTTP Get请求？

核心问题 #

你的代码存在两个关键错误：

1. 错误地将实例转为JSON字符串：HttpParams 需要接收普通键值对对象作为参数，而非JSON字符串，直接传入字符串会导致参数无法被正确解析。
2. CodeTable类缺少构造函数：你使用带参数的方式创建实例，但类默认没有定义对应构造函数，导致实例属性无法被正确赋值，最终传递给服务器的参数会不符合预期。

修正步骤 #

1. 给CodeTable类添加构造函数 #

确保创建实例时能正确初始化所有属性：

export class CodeTable {
  public tableId: number;       
  public connectionTable: number;                                       
  public connectionCode: number;    
  public code: number;           
  public translation: string = ""; 
  public price: number = 0;      
  public picture!: any;

  // 添加构造函数，匹配你创建实例时的参数顺序
  constructor(
    tableId: number,
    connectionTable: number,
    connectionCode: number,
    code: number,
    translation: string,
    price: number,
    picture: any
  ) {
    this.tableId = tableId;
    this.connectionTable = connectionTable;
    this.connectionCode = connectionCode;
    this.code = code;
    this.translation = translation;
    this.price = price;
    this.picture = picture;
  }
}

2. 修正请求参数处理代码 #

直接使用实例对象（或转为普通对象）创建HttpParams，不要做JSON序列化：

const getUrl: string = environment.urlCodeTable;
// 直接使用实例作为参数源，或通过扩展运算符转为纯对象（避免类的潜在影响）
const selectParams = { ...parameterToServer };
// 创建正确的HttpParams实例
const queryParams = new HttpParams({ fromObject: selectParams });
// 发送请求时传入queryParams
return this.http.get<ServiceResponse>(getUrl, { params: queryParams })
  .pipe(catchError(this.handleError));

如果你的CodeTable类没有额外方法，也可以直接传入实例（需类型断言）：

const getUrl: string = environment.urlCodeTable;
const queryParams = new HttpParams({ fromObject: parameterToServer as Record<string, any> });
return this.http.get<ServiceResponse>(getUrl, { params: queryParams })
  .pipe(catchError(this.handleError));

额外说明 #

• HttpParams 的fromObject参数要求每个属性值都是字符串、数字或布尔值，你的CodeTable属性都是符合要求的基本类型，因此可以直接使用。
• 如果picture属性是复杂对象，建议在传递前处理为服务器能接收的格式（比如Base64字符串），否则GET请求的URL参数无法携带复杂对象。

内容的提问来源于stack exchange，提问作者Moshik Amit