await Promise. все не ждут через Angular

Question

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

     async onUpdateSettings() {
            let updated = false;
            await Promise.all(Object.keys(this.settingsForm.controls).map(async (key) => {
              if (this.settingsForm.controls[key].dirty) {
                const toUpdateSetting = this.peopleSettings.find(ps => ps.settingKey.includes(key));
                toUpdateSetting.settingValue = this.settingsForm.get(key).value;
                this.peopleSettingsService.updateSetting(toUpdateSetting).subscribe(() => {
                  updated = true;
                  console.log('UPDATE');
                }, (error) => console.log(error));
              }
            }));
            console.log('DONE');
            if (updated) {
              this.toastrService.success('Settings succsessfully updated.');
            }
          }
// results always in:
// DONE
// UPDATE UPDATE UPDATE

Answer 1

Ваш код необходимо изменить на: -

async onUpdateSettings() {
        let updated = false;
        await Promise.all(Object.keys(this.settingsForm.controls).map(async (key) => {
          if (this.settingsForm.controls[key].dirty) {
            const toUpdateSetting = this.peopleSettings.find(ps => ps.settingKey.includes(key));
            toUpdateSetting.settingValue = this.settingsForm.get(key).value;
            return this.peopleSettingsService.updateSetting(toUpdateSetting).pipe(map(() => {
              updated = true;
              console.log('UPDATE');
            }), catchError(() => console.log(error))).toPromise();
          }
        }));
        console.log('DONE');
        if (updated) {
          this.toastrService.success('Settings succsessfully updated.');
        }
      }