小编Asi*_*idi的帖子

如何将文件和数据从 Angular 上传到 .NET core

我正在运行 Angular 9 应用程序,我想实现文件上传行为。在表单中,用户必须输入标题、描述并仅上传一个 .zip 格式的文件,在单击“提交”时,我想通过 http post 调用将表单值与文件一起发送到后端(使用 dotnet)。

文件上传.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);
            }});
        }
Run Code Online (Sandbox Code Playgroud)

文件上传.component.html

<input type="file" #file placeholder="Choose file" (change)="uploadFile(file.files)" multiple>
Run Code Online (Sandbox Code Playgroud)

文件控制器.cs

[HttpPost("api/idea/add")]
public async Task<IActionResult> AddIdea([FromBody] IdeaDto ideaDto) { }
Run Code Online (Sandbox Code Playgroud)

后端期望数据采用以下格式

IdeaDto.cs

public class IdeaDto
{
    public IFormFile File { get; set; }
    public …
Run Code Online (Sandbox Code Playgroud)

javascript c# typescript .net-core angular

3
推荐指数
1
解决办法
6635
查看次数

标签 统计

.net-core ×1

angular ×1

c# ×1

javascript ×1

typescript ×1