Angular中表单提交后外键未写入数据库（字段值为null）

我来帮你梳理下这个外键为空的问题，核心症结是前后端的数据结构不匹配，导致后端没法正确解析前端传递的site_id，最终数据库外键字段没有被赋值。下面是具体的排查线索和解决方案：

1. 核心问题：数据结构不匹配 #

前端提交的payload里，site_id是一个UUID字符串：

{
  "site_id": "4e9e2710-0c06-45f1-909e-36299f1b4780",
  "num_plate": "1-HBO-999",
  "dop": "2022-07-20",
  "active": true
}

但后端的NumberplateCreatePayload里对应的是Site类型的对象字段：

public class NumberplateCreatePayload {
  private String num_plate;
  private Date dop;
  private Boolean active;
  private Site site; // 这里是对象，不是字符串UUID
}

Spring无法自动把字符串直接转换成Site实例，所以site字段会被设为null，数据库里的外键site_id自然也就没有值了。

2. 两种可行的解决方案 #

方案一：调整前端payload结构，嵌套site对象 #

修改前端提交的数据格式，把site_id放到site对象里，和后端DTO的结构对齐：

// 在create方法里重构payload
const payload = {
  ...this.formGroup.value,
  site: { site_id: this.formGroup.value.site_id }
};
// 再调用接口提交
this.apiService.createNumberplate(payload).subscribe(...)

这样后端就能把site.site_id映射到Site对象的site_id属性（前提是你的Site类有site_id这个UUID类型的主键字段）。

方案二：修改后端DTO，手动关联Site对象 #

第一步：更新NumberplateCreatePayload，添加site_id字段

public class NumberplateCreatePayload {
  private String num_plate;
  private Date dop;
  private Boolean active;
  private UUID site_id; // 新增对应前端的site_id字段
}

第二步：在服务层处理时，通过site_id查询Site并关联

假设你有SiteRepository，在创建Numberplate的业务逻辑中：

// 从payload获取site_id
UUID siteId = numberplateCreatePayload.getSite_id();
// 查询对应的Site实例（处理找不到的异常情况）
Site site = siteRepository.findById(siteId)
    .orElseThrow(() -> new IllegalArgumentException("未找到ID为" + siteId + "的站点"));
// 将Site设置到Numberplate对象中
Numberplate numberplate = new Numberplate();
numberplate.setSite(site);
// 赋值其他字段...
numberplateRepository.save(numberplate);

3. 额外排查验证点 #

• 在后端Controller层打印接收的payload，确认site_id是否被正确接收（如果用方案二的话）；
• 检查Site类的主键字段名称是否是site_id，如果是id，则需要调整DTO字段名或者用@JsonProperty("site_id")注解来做映射；
• 确认日期格式是否匹配，虽然这不是外键问题，但避免其他字段报错影响整体逻辑；
• 检查Spring Boot的JSON配置，确保字段名的下划线和驼峰映射正常（比如site_id能正确映射到DTO的对应字段）。

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