угловой 2 - результат отображения GET на консоли

Question

Я исправляю учебник по героям и нахожу то, что я не понимаю, поэтому, надеюсь, кто-то может помочь.

В HeroesComponent.ts этот фрагмент кода

export class HeroesComponent implements OnInit { 

heroes: Hero[]; 
selectedHero: Hero; 

    constructor(private router: Router, private heroService: HeroService) { } 

getHeroes(): void { 
    this.heroService.getHeroes().then(heroes => this.heroes = heroes); 
    } 

    ngOnInit(): void { 
    this.getHeroes(); 
    } 

onSelect(hero: Hero): void { 
    this.selectedHero = hero; 
} 

И это работает - имена героя отображаются в соответствующем формате HTML.

Но, в getHeroes(), если добавить консольное заявление

getHeroes(): void { 
    this.heroService.getHeroes().then(heroes => this.heroes = heroes); 
    console.log("heroes list is " + this.heroes) 
    } 

Затем браузер консоль показывает «список героев не определен», но массив героя отображается в HTML.

Почему герои не определены?

Answer 1

поскольку консоль синхронна, а get является асинхронным, массив не определен