Angular向.NET Core上传文件数组时绑定数据为空的问题求助

我来帮你排查并解决这个问题，核心有两处关键错误需要修正：

1. Angular端FormData构建方式有误 #

你直接把整个fileList数组通过formData.append('ofile',this.fileList)添加，这会让FormData把数组转成字符串（类似[object File],[object File]），后端完全无法解析成文件对象。正确做法是循环文件数组，逐个添加到FormData，且使用同一个key名：

修正后的Angular upload方法：

upload() {
  const formData: FormData = new FormData();
  // 循环文件列表，逐个添加到FormData
  this.fileList.forEach(file => {
    formData.append('ofile', file, file.name); // 第三个参数为文件名，可选但建议传入
  });
  console.log('FormData内容:', Array.from(formData.entries()));
  this._service.PostFormData(formData).subscribe(data=>{
    console.log('上传成功', data);
  });
}

2. .NET Core端接收模型类型错误 #

你当前用byte[] ofile接收文件，不符合ASP.NET Core处理上传文件的规范。上传的多文件应该用List<IFormFile>类型接收（你之前注释掉的那行才是正确的），IFormFile是框架专门封装上传文件的类型，天然支持多文件接收。

修正后的.NET Core代码：

public class Test {
    // 用List<IFormFile>接收多文件，key名要和Angular端FormData的key完全一致
    public List<IFormFile> ofile { get; set; }
}

[HttpPost]
public IActionResult GetName([FromForm]Test oTest) {
    // 现在oTest.ofile应该能正常接收到文件列表了
    if(oTest.ofile != null && oTest.ofile.Any()){
        foreach(var file in oTest.ofile){
            // 示例：获取文件信息
            var fileName = file.FileName;
            var fileSize = file.Length;
            // 后续可做文件保存、流读取等操作
        }
    }
    return Ok();
}

额外注意点 #

• Angular的PostFormData方法不要手动设置Content-Type：当使用FormData时，浏览器会自动添加正确的multipart/form-data请求头及边界值，手动设置反而会导致解析失败。
• 你可以把HTML里的多个单文件输入框改成支持多文件选择的输入框：<input type="file" multiple (change)="onFileChanged($event)">，这样用户一次就能选多个文件，体验更流畅，当前的多输入框逻辑也能正常工作。

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