Блог

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

Вот упрощенная версия того, что я пробовал до сих пор:

 async onSubmit(form) {
    if(specialField) {
        const response = await this.updateSpecialField();
    }
    // I will leave the rest of the form submission abstracted away
}

async updateSpecialField() {
    this.specialService.updateField().subscribe(then => {
        this.specialService.loadingFields$.subscribe(data => {
            this.loading = data;
        });
    });
}
 

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

Вот другой подход к той же функции updateSpecialField:

 async updateSpecialField() {
    let updatedFieldResponse = await this.specialService.updateField().toPromise();
    return Promise.resolve(updatedFieldResponse);
}
 

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

Попробуйте это

 async onSubmit(form) {
    if(specialField) {
        const response = await this.updateSpecialField();
    }
    // I will leave the rest of the form submission abstracted away
  }
  
  async updateSpecialField() {
    return this.specialService.updateField().pipe(
              switchMap((_: any) =>
                this.specialService.loadingFields$.toPromise().then(data => {
                    this.loading = data;
                })
              )
            ).toPromise();
  }