Spring Boot接收Angular关联表提交数据报JSON解析异常如何解决

错误根因 #

后端Halls实体类的cityid字段为Cities对象类型，Jackson反序列化JSON时需要匹配的对象结构，而你前端提交的cityid是字符串类型的城市ID，没有对应的构造方法可以将字符串转为Cities实例，因此抛出转换异常。
同时前端代码存在两处逻辑错误：

• select绑定只传了城市ID值，没有按照Hall模型的定义绑定完整City对象
• retrieveCities是异步请求方法，直接将其返回值赋值给hall.cityid无法拿到有效城市数据

修复步骤 #

1. 调整前端select绑定逻辑 #

将select的ngValue绑定为完整的城市对象，而非仅绑定ID：

<select [(ngModel)]="hall.cityid" name="cityid">
  <option *ngFor="let c of cities" [ngValue]="c">{{c.name}}</option>
</select>

调整后提交的cityid会是{id: 2, name: "xxx"}格式的对象，和后端期望的Cities结构匹配。

2. 修正城市列表加载逻辑 #

页面初始化时调用方法加载城市列表，不要用异步方法的返回值直接给hall属性赋值：

ngOnInit(): void {
  // 页面初始化加载城市下拉数据
  this.retrieveCities();
}

// 初始化hall对象时不要调用异步方法赋值
hall: Hall = {
  name: '',
  placeqty:'',
  cityid: undefined
};

retrieveCities(): void {
  this.cityService.getAll()
    .subscribe(
      data => {
        this.cities = data;
        // 可选：默认选中第一个城市
        if(this.cities && this.cities.length > 0){
          this.hall.cityid = this.cities[0];
        }
      },
      error => {
        console.log(error);
      });
}

可选：后端适配仅传ID的场景 #

如果你不想前端传递完整城市对象，也可以通过修改后端代码适配：
给Cities实体类添加无参构造和字符串参数构造方法，让Jackson可以通过传入的ID字符串生成Cities实例：

@Entity
@Table(name = "cities")
public class Cities {
    // 原有属性、getter、setter不变

    // 新增无参构造（JPA要求必须有）
    public Cities() {
    }

    // 新增字符串参数构造，用于Jackson反序列化
    public Cities(String cityId) {
        this.id = Integer.parseInt(cityId);
    }
}

内容的提问来源于stack exchange，提问作者Bogdan Onyshenko