我正在运行一个Angular 9应用程序,想要实现文件上传行为。在表单中,用户必须输入标题、描述信息并只上传一个.zip格式文件,在点击提交时,我想通过HTTP POST调用将表单值和文件一起发送到后端(使用dotnet)。
file-upload.component.ts
uploadFile(files) {
const formData = new FormData();
const fileToUpload = files[0] as File;
formData.append('file', fileToUpload, fileToUpload.name);
const data = {
title: this.form.value.Title,
description: this.form.value.Description,
File: formData
};
console.log(data);
this.http.post('https://localhost:5001/api/idea/add', data).subscribe((response) => {
console.log(response);
}});
}
file-upload.component.html
<input type="file" #file placeholder="Choose file" (change)="uploadFile(file.files)" multiple>
FileController.cs
[HttpPost("api/idea/add")]
public async Task<IActionResult> AddIdea([FromBody] IdeaDto ideaDto) { }
后端期望数据的格式如下所示
IdeaDto.cs
public class IdeaDto
{
public IFormFile File { get; set; }
public string Title { get; set; }
public string Description { get; set; }
}
提交数据时出现以下错误
另外,我使用 console.log(data) 并获得文件值,如下图所示。 我不确定这是否是正确的数据
问题在哪里? 我真的没有任何想法,也许我需要一个新的想法,在经历了这么多时间之后