Как дождаться завершения асинхронной функции перед выполнением других строк кода

#angular #angularfire2

#angular #angularfire2

Вопрос:

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

Я прочитал еще один подобный вопрос по этому поводу. Но я не могу четко ответить, потому что в другом вопросе асинхронная функция и функция after находятся в одном файле. У меня есть некоторые подсказки Promise и Observable . но я не очень хорошо понимаю, как его правильно использовать

Вот сервис, который у меня есть:

 public changeImage = (e: any, prevImage: string, filePath: string) => {
    const file  = e.target.files[0];
    const ref   = this.storage.ref(filePath);
    const task  = this.storage.upload(filePath, file);

    this.uploadPercent = task.percentageChanges();
    task.snapshotChanges().pipe(
      finalize(() => console.log(`Finished`) )
    ).subscribe();
}
 

и вот компонент, который вызывает службу:

 public uploadImage = async (e: any) => {
    this.uploading        = true;
    await this.imageStorage.changeImage(e, this.admin.adminImage, `admin/${e.target.files[0].name}`);
    /* I want to execute code here after upload is success */
    this.uploading = false; /* executed after upload finished */
}
 

Как я могу этого добиться?

Комментарии:

1. Не подписывайтесь на сервис. Верните наблюдаемое и дайте компоненту подписаться. Очевидно, вы уже знаете, как печатать «готово», когда загрузка завершена, поэтому вы должны иметь возможность установить для загрузки значение false.

2. после игры он работает mate. Спасибо @JBNizet