Мой код ниже предназначен для загрузки одного файла, но я пытаюсь отправить сразу несколько файлов из Angular в Spring Boot. Отправка нескольких данных формы в ArrayList в Spring Boot приводит к null, и я не могу @RequestParam отправить данные одной формы в Spring Boot, поскольку количество файлов, отправляемых из Angular, является динамическим (определяется пользователем). Кто-нибудь может помочь?
Контроллер весенней загрузки:
@PostMapping("/jobAdApplication")
public void jobAdApplication (@RequestParam("files") MultipartFile[] files,
@RequestParam("candidateName") String candidateName) {
(...)
}
Угловой компонент:
selectedFiles!: FileList;
file!: file;
(...)
if (this.selectedFiles) {
let file: File | null = null;
const formData: FormData = new FormData();
for (let i = 0; i < this.selectedFiles.length; i++) {
file = this.selectedFiles.item(i);
if (file) {
formData.append(`file${i}`, file);
}
}
formData.append('candidateName', this.applyFormGroup.get('name')?.value);
this.fileService.uploadFile(formData).subscribe({
next: response => {
alert('Files sent successfully')
this.applyFormGroup.reset();
},
error: err => {
alert(`Error: ${err.message}`);
}
});
this.selectedFiles = undefined;
}
Угловой сервис:
uploadFile(jobAdApplication: FormData): Observable<any> {
return this._http.post<any>(`${this.jobCandidateUrl}/jobAdApplication`, jobAdApplication);
}





Разве selectedFiles!: FileList не должен быть итерируемым? Как массив? Затем цикл for (of) также следует изменить для доступа к файлу по индексу [i]. Если это объект, например карта, вы можете использовать цикл for (in) и получать элементы, используя Object.entries.
Не могли бы вы войти в консоль jobAdApplication, прежде чем опубликовать это? Мне просто любопытно, как выглядит структура данных.
Если все в порядке, перейдите к тому, как вы добавляете файлы.
Контроллер ожидает массив MultipartFile в файлах параметров.
@RequestParam("files") MultipartFile[] files
Но здесь вы добавляете их в файл с изменяющимся индексом.
formData.append(`file${i}`, file);
Вместо этого оставьте им именованные файлы, чтобы контроллер мог получить доступ к нужным вещам.
formData.append('files', file);
Привет, Йоосеп, я изменил selectedFiles!: any[], который, кажется, работает нормально, и formData.append('files', file) работает совершенно правильно. Звучит очевидно, но нелогично для меня с точки зрения двух экземпляров, имеющих одно и то же имя/идентификатор («файлы»). Казалось, что одно сменяет другое. Но это кажется очевидным с точки зрения сопоставления внутренних свойств, и это работает. Большое спасибо!