解决承诺时Angular2错误:键入'Promise<Hero[]>‘不能指定键入'Hero[]’

Question

已更新。

我正在学习来自Angular2的https://angular.io/docs/ts/latest/tutorial/toh-pt4.html教程

下面是来自HeroService的heroes.component.ts调用，

Heroes.component.ts

import { Component , OnInit } from '@angular/core';

import { Hero } from './hero';

import { HeroService } from './hero.service';



@Component({
  selector: 'my-heroes',
  template: `


        <h2>My Heroes</h2>
        <ul class="heroes">
            <li *ngFor="let hero of heroes">
                 <span class="badge">{{hero.id}}</span> {{hero.name}}
            </li>
         </ul> `,

})

export class HeroesComponent implements OnInit {
    title = 'Tour of Heroes';
    heroes: Hero[];
    selectedHero: Hero;

    constructor(private heroService : HeroService ){

    }

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

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


}

和用getHeroes()编写的HeroService调用

HeroService.ts

import { Injectable } from '@angular/core';
import { Hero } from './hero';
import { HEROES } from './mock-heroes';

@Injectable()
export class HeroService{
    getHeroes() { 
       return Promise.resolve(HEROES);
     }
}

我得到以下编译时错误：

错误TS2322:键入‘承诺’不能指定为键入'Hero[]‘。属性“长度”在“允诺”类型中缺失。

请建议一下。

Answer 1

将heroes: Hero[];更改为heroes: any;解决了这个问题，但是控制台返回一个错误，因为ngFor只支持iterables。最后，代码编译和应用程序运行，但有一个小问题，我发现干扰。