FormData добавить файл Angular
Я использую FormData для отправки изображения в Laravel API. Когда я использую этот код, он не работает:
onChange(event: any) {
const images = event.target.files;
if (images.length <= 5) {
Array.from(images).forEach(image => {
console.info(image);
const formData: FormData = new FormData();
formData.append('image', image, image.name);
console.info(formData);
this.http.post('http://127.0.0.1:8000/api/web', formData).subscribe(data => {
console.info(data);
});
});
}
event.target.value = '';
}
console.info(image); Я получаю File(651565){}
console.info(formData); Я получаю FormData {}
console.info(data); Я получаю {}
Итак, если вы видите, первое работает, а второе - нет.
Какие-нибудь советы?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
если к HTMLInputElement добавлена функция onChange, попробуйте следующее:
const images = (event.target as HTMLInputElement).files;
после редактирования
Я внимательно изучил это, и, похоже, проблема в этой строке:
event.target.value = '';
и причина этого в том, что здесь:
const images = (event.target as HTMLInputElement).files;
вы принимаете файлы как «Тип ссылки», поэтому, если вы измените значение, как здесь:
event.target.value = '';
вы удаляете объект файлов.
попробуйте сделать это:
переместите 'event.target.value =' ';' чтобы подписаться на метод, поэтому только в случае успеха вы можете удалить их, а также вам нужно создать функцию ошибки, а затем удалить ее при возникновении ошибки.
в основном то, что вы делаете здесь, - это удаление файлов только после того, как они были загружены или произошла ошибка, поэтому они вам больше не нужны.
Ничего не изменилось