如何将文件从角度发送到 dotnet 核心控制器答案

【问题标题】：How to send file from angular to dotnet core controller如何将文件从角度发送到 dotnet 核心控制器
【发布时间】：2020-05-18 21:24:38
【问题描述】：

我已经看到了很多相关的问题，并且我访问了其中的许多问题。但他们都没有解决这个问题，因为大多数解决方案都是围绕文件上传的独立逻辑工作的。虽然我正在尝试实现与此类似的目标

Upload model with IFormFile propertis from Angular2 to ASP.NET Core WebApi

我正在使用角度反应形式，我将数据提交到 dotnet 核心的控制器。在我传递文件模块之前一切正常

user.model.ts

export class user{

public fullName: string;
public phoneNumber: string;
// etc
//etc
public file File;

}

服务器上的模型

public class User{

public string FullName {get; set;}

public string PhoneNumber{get; set;}

public IFormFile File {get; set;}


   }

终点

public async Task<IActionResult> AddUserDetail(User request)
        {
            if (!ModelState.IsValid)
                return BadRequest("One or more required parameters not passed.");

            var response = await _qaMetricService.AddQAMetricDetail(request);

            return Ok(response);
        }

angular文件中的文件上传功能

fileChange = (event: any) => {
    const files: FileList = event.target.files;
    //const fileList = new Array<File>();
    const formData = new FormData();

    for (let i = 0; i < files.length; i++) {
      formData.append(files.item(i).name, files.item(i));
      this.fileList.push(files.item(i));

      console.log(this.fileList);    //working on multiple files before

    }


  }




 OnSubmit(){

    ////All code

    userVM.file = this.fileList[0];


//calling serice 

 this._userService.addUserService(userVM).subscribe((res: APIResponse) => {

});



    }

它不起作用.. 现在大多数解决方案都建议使用 FormData.. 我如何能够一次使用 FormData 提交整个模型数据？？

请有人帮我解决这个问题。

【问题讨论】：

标签： angular .net-core file-upload

【解决方案1】：

你可以这样发送整个模型

const formData = new FormData();
formData.append('fullName ', this.form.get('fullName').value);
formData.append('phoneNumber', this.form.get('phoneNumber').value);
formData.append('file', this.form.get('file').value);
this._userService.addUserService(formData).subscribe(console.log)

如果您有多个文件，您可以使用键中的 [] 将所有文件附加到 formData 中：

files.forEach((file) => {
 formData.append('file[]' , file, file.name);
}

【讨论】：