Я разрабатываю компонент загрузки формы в Angular 10, который загружает каждый файл, выбранный пользователем, по одному. Эта часть работает хорошо.
Я хочу расширить ее, чтобы компонент «знал», когда все загрузки завершены. Я мог легко отслеживать файлы, загруженные с помощью переменной счетчика, однако я изо всех сил пытаюсь реализовать необходимый шаблон наблюдателя / подписчика для выполнения sh this.
Ниже мой код (без моих попыток реализовать Observer)
Метод ниже отвечает за загрузку массива файлов
submitDocuments() {
let index: number;
let name: string;
for (let i = 0; i < this.formUploadService.selectedFiles.length; i++) {
name = this.formUploadService.selectedFiles[i].name;
index = this.getIndexByName(name);
const file = this.formUploadService.selectedFiles[i];
this.formUploadService.upload(file).subscribe(
event => {
if (event.type === HttpEventType.UploadProgress) {
this.selectedFiles[index].progress = Math.round(100 * event.loaded / event.total);
} else if (event instanceof HttpResponse) {
return file;
}
},
error => {
}
);
}
}
, а затем метод вызывается в другом месте
this.submitDocuments();
Как я могу сделать submitDocuments () Наблюдаемый объект, который можно подписать, чтобы проверить, все ли файлы были загружены через счетчик или другую переменную, возвращаемую наблюдаемым?
---- @@ Edit @@ ----
Мне удалось решить эту проблему с помощью Subjects, но я оставлю этот вопрос открытым, поскольку я уверен, что это можно сделать лучше, и если да, мне бы хотелось увидеть, как
в классе компонентов я объявляю :
isUploadingCompleted = new Subject<boolean>();
затем я просто отслеживаю количество завершенных загрузок и обновляю тему следующим образом:
this.isUploadingCompleted.next(true);
и подписываюсь на тему:
this.isUploading.subscribe((status) => {
if (status === true) {
console.log('done');
}
});