Angular 6-单个表单组中的多个文件输入

时间:2019-04-16 03:58:14

标签: c# angular .net-core

我正在为我的Web应用程序设置一个上传器 由2个文件输入元素组成,其中 第一个文件输入将获取图像并将其存储到图像列表中 第二个将获取pdf并将其存储到pdf文件变量列表中。

我要做的方法是将文件对象存储在我命名为pdfStorage和imageStorage的变量中,以便在填写表单中的必要字段并按下确认按钮后将其传递给dotnet core api服务。 / p>

将文件对象存储到变量时,在客户端没有问题。但是,一旦我将这些值发送到服务的参数,这些字段就始终显示为空。

我已经在dotnet核心服务中查看了Request.Form,并且看到它在那里。我不明白为什么它没有被填充到ActionResult的参数中。

这是我放置在dotnet核心服务中的代码:

ActionResult:

[HttpPost("SaveNewData"),DisableRequestSizeLimit]
[Consumes("multipart/form-data")]
public ActionResult SaveNewData([FromForm]MyModelUpload modelUpload) {
    var modelUploaded = modelUpload;
    return Ok();
}

参数中的模型:

public class MyModelUpload {
    public IFormFile[] imageFile { get; set; }
    public string description {get;set;}
    public IFormFile[] pdfFileList {get;set;}
    public string uploadedBy { get; set; }
    public string title { get; set; }
    public DateTime? dateEnd {get; set;}
}

这是我用于以角度发送表单数据的测试代码:

SaveNewData(formGroupData) {
    let submitData = new FormData();
    let pdfFileArray = formGroupData.pdfStorage;

    // UPLOAD'S DETAIL
    submitData.append('title',formGroupData.title);
    submitData.append('description',formGroupData.title);
    submitData.append('uploadedBy',formGroupData.uploadedBy);
    submitData.append('dateEnd',formGroupData.dateEnd);

    // // FOR IMAGE FILE
    let imageFileObject = <File>formGroupData.imageStorage[0];
    console.log(pdfFileArray);
    submitData.append('imageFile[]',imageFileObject,imageFileObject.name);

    // // LIST OF PDF DOCS
    for(let arrayIndex in pdfFileArray) { 
        submitData
            .append(`pdfFileList[]`,pdfFileArray[arrayIndex]
                ,pdfFileArray[arrayIndex].name);
    }

    return this.http
        .post(`http://localhost:5000/Upload/SaveNewData`,submitData);
}

如何发送存储在存储变量中的那些文件对象?

1 个答案:

答案 0 :(得分:2)

您应该使用此:

 SaveNewData(formGroupData) {
    let submitData = new FormData();
    let pdfFileArray = formGroupData.pdfStorage;

    // UPLOAD'S DETAIL
    submitData.append('title',formGroupData.title);
    submitData.append('description',formGroupData.title);
    submitData.append('uploadedBy',formGroupData.uploadedBy);
    submitData.append('dateEnd',formGroupData.dateEnd);

    // // FOR IMAGE FILE
    let imageFileObject = <File>formGroupData.imageStorage[0];
    console.log(pdfFileArray);
    submitData.append('imageFile',imageFileObject);

    // // LIST OF PDF DOCS

   for (let i = 0; i < pdfFileArray.length; i++) {
     submitData.append("pdfFileList",pdfFileArray[i]);
    }

    return this.http
        .post(`http://localhost:5000/Upload/SaveNewData`,submitData);
}