Вызов службы внутри цикла в Angular, дающий результат во 2-й раз вместо 1-го

#javascript #angular #typescript

#javascript #angular #typescript

Вопрос:

Я пытаюсь вызвать службу в Angular внутри цикла for и заполнить результат внутри карты.

 map = new Map<string, string[]>();

this.effectivitiesList = this.trimEffectivities.split(",");

for (let effec of this.effectivitiesList) {
  this.hexcodeService
    .GetHexCodeLineValues(
      this.majorModel,
      this.wireNumber,
      this.selected,
      this.trimEffectivities,
      effec
    )
    .subscribe(data => {
      this.hexcodeLineList = data;
    });

  this.map.set(effec, this.hexcodeLineList);
}

console.log(this.map);
  

Проблема в том, что я не получаю данные при первом выполнении, результат получается в виде

Карта — >

 VA305 , Array[0]
VA504 , Array[0]
  

Но когда я вызываю метод во второй раз, я успешно получаю данные.

 VA305 , Array[3]
VA504 , Array[3]
  

Кто-нибудь знает причину этого?

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

1. это потому, что это выглядит как GetHexCodeLineValues асинхронный.

Ответ №1:

Попробуйте сделать окружающую функцию асинхронной, используя async ключевое слово. Затем вы можете await получить результат hexcodeService. А также замените suscribe на toPromise , чтобы сделать это возможным:

 async myFunction() {
    for (let effec of this.effectivitiesList) {
        const data = await this.hexcodeService
            .GetHexCodeLineValues(
                this.majorModel,
                this.wireNumber,
                this.selected,
                this.trimEffectivities,
                effec
            ).toPromise();

        this.hexcodeLineList = data;

        this.map.set(effec, this.hexcodeLineList);
    }
}