Как загрузить файл по форме submit в angular2?

Question

Как загрузить файл по форме submit в angular2. Я хочу использовать ng2-file-upload библиотека. Но я не могу использовать его в форме submit. Кто-нибудь может мне помочь?

Answer 1

Это должно быть возможно, просто передав загруженный файл в ваш метод, который можно вызвать в submit.

В вашем HTML

<form #sieFileUploadForm="ngForm"> 
    <input type="file" id="fileItem" 
    value="Browse..."> 

В вас т.с.

uploadFile(file){ 
console.log(file) 
} 

Примечание: - при отправке beckend вам нужно сделать это FormData нравится этот

uploadFile(file){ 
let formData = new FormData(); 
formData.append('FILENAME', file); 
} 

Answer 2

Итак, наконец, я понимаю вашу проблему, которая появляется, это дополнительные форматы, которые вы хотите отправить вместе с файлом. После создания вашего FileUploader, вы можете добавить дополнительную форму со следующим кодом:

uploader: FileUploader = new FileUploader({ url: "http://localhost/upload.php" }); 

    constructor() { 
    this.uploader.onBuildItemForm = (item, form) => { 
     form.append("key1", "value1"); 
     form.append("key1", "value2"); 
    }; 
} 

Некоторые говорят, что это немного симпатичнее, чтобы поместить этот код в ngOnInit(), но я не хочу раздувать этот код и это решение здесь не очень важно.

После этого вы можете просмотреть дополнительные данные сообщения в полезной нагрузке http-сообщения, например, с помощью инструментов разработчика Firefox. Они должны выглядеть следующим образом:

-----------------------------110224700718602891206418821 
Content-Disposition: form-data; name="key1" 

value1 
-----------------------------110224700718602891206418821 
Content-Disposition: form-data; name="key1" 

value2 

(Ваша граница не будет же)

Я нашел solution на GitHub трекере проекта.