Angular 6 - ввод нескольких файлов в одной группе форм

Question

Я настраиваю загрузчик для своего веб-приложения который состоит из 2 элементов ввода файла, где первый файл ввода получит изображение и сохранит его в списке изображений переменной а второй получит pdf и сохранит его в списке переменных pdf files.

подход, который я применил к этому, заключается в сохранении файловых объектов в переменных, которые я назвал pdfStorage и imageStorage, так что они будут переданы в сервис API ядра dotnet после заполнения необходимых полей в моей форме и нажатия кнопки подтверждения.

У меня не возникает проблем на стороне клиента при сохранении файловых объектов в переменной. однако, как только я отправляю эти значения в параметры службы, для этих полей всегда отображается значение NULL.

Я просмотрел Request.Form в основном сервисе dotnet и вижу, что он там есть. Я не понимаю, почему он не заполняется параметром 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);
}

Как отправить те файловые объекты, которые я хранил в переменных хранения?

Answer 1

Вы должны использовать это:

 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);
}