Angular 12向ASP.NET Core 3.1发送FormData时，列表与自定义类类型数据无法正常绑定的问题求助

这个问题的核心在于FormData只能直接处理字符串、Blob或File类型的数据，当你尝试直接append数组或自定义对象时，JavaScript会自动把它们转换成字符串[object object]，后端自然无法解析成对应的复杂类型，导致字段为null。下面是分步的解决方案：

1. 调整Angular的FormData追加逻辑 #

我们需要把复杂类型（数组、自定义对象）序列化为JSON字符串后再添加到FormData中，这样后端可以接收并反序列化：

formData: FormData = new FormData(); 
const formValue = this.registerForm.value; 

Object.keys(formValue).forEach(key => {
  const value = formValue[key];
  
  // 判断是否是复杂类型（排除File对象，因为文件需要直接传递）
  if (typeof value === 'object' && value !== null && !(value instanceof File)) {
    // 将对象/数组序列化为JSON字符串
    this.formData.append(key, JSON.stringify(value));
  } else {
    // 普通类型和文件直接追加
    this.formData.append(key, value);
  }
});

2. 修正HttpService的请求头配置 #

不要手动设置Content-Disposition: multipart/form-data，因为浏览器会自动生成包含正确boundary的请求头，手动设置反而会导致后端解析失败：

postDataWithFile(url: string, formData?: FormData, params?: HttpParams) { 
  const httpOptions = {
    params: params,
    headers: new HttpHeaders() // 不需要额外设置multipart相关头
  };
  return this.http.post<any>(this.baseUrl + url, formData, httpOptions); 
}

3. 后端处理JSON字符串的反序列化 #

后端接收到的复杂类型是JSON字符串，需要手动反序列化为对应的List或自定义类。你可以在控制器的Action中直接处理：

控制器Action示例 #

using System.Text.Json;

[HttpPost("Add")]
public IActionResult Add([FromForm] TradingPartnerModel model)
{
    // 手动解析requestTypeDDL的JSON字符串
    if (model.requestTypeDDL == null)
    {
        var requestTypeJson = Request.Form["requestTypeDDL"].FirstOrDefault();
        if (!string.IsNullOrEmpty(requestTypeJson))
        {
            model.requestTypeDDL = JsonSerializer.Deserialize<List<DropDownModel>>(requestTypeJson);
        }
    }

    // 后续业务逻辑...
    return Ok();
}

额外优化：统一大小写匹配 #

如果前端使用camelCase（比如requestTypeDdl）而后端模型是PascalCase（RequestTypeDDL），可以在Startup.cs中配置JSON序列化忽略大小写，避免名称不匹配的问题：

services.AddControllers()
    .AddJsonOptions(options =>
    {
        options.JsonSerializerOptions.PropertyNameCaseInsensitive = true;
        options.JsonSerializerOptions.PropertyNamingPolicy = JsonNamingPolicy.CamelCase;
    });

关键注意点 #

• 确保你的DropDownModel类是public的，并且属性名称和前端序列化的JSON字段一致（或通过配置忽略大小写）。
• 文件类型（IFormFile）不需要序列化，直接通过FormData传递即可，后端能正常解析。

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