在Angular2中,如何返回服务值？

Question

我在这里跟随Angular2的教程说明:https://angular.io/docs/ts/latest/tutorial/toh-pt4.html

有一点,它指出要将服务的承诺信息返回给组件,需要以下语法:

getHeroes() {
  this._heroService.getHeroes().then(heroes => this.heroes = heroes);
}

我试图准确理解这里发生了什么,虽然我是Angular2和TypeScript的新手.文件说:

我们的回调将组件的英雄属性设置为服务返回的英雄数组.

我对括号中发生的事情感到困惑,特别是最终的"英雄"来自哪里.据我所知,这项服务不会归还"英雄".相反,它从mock-heroes导入并返回HEROES,后者本身使用Heroes接口并返回HEROES数组.在任何一个中我都看不到"英雄"(小写).

"英雄"是在飞行中创造出来的吗？有人可以更详细地解释每个部分:

heroes => this.heroes = heroes

呢？非常感谢.

Answer 1

要记住的第一件事是该方法heroService.getHeroes()不会返回英雄,而是最终会解决的承诺,返回一个英雄列表:

getHeroes() {
    return Promise.resolve(HEROES);
}

让我们解释一下这行代码:

this._heroService.getHeroes().then(heroes => this.heroes = heroes);

这也可以用以下方式编写:

this._heroService.getHeroes().then(function(heroesFromPromise) {
    this.heroes = heroesFromPromise;
});

这意味着,调用_heroService.getHeroes()返回promise 的方法.当promise解析时,将then使用promise的结果调用内部回调.

当发生这种情况时,执行调用回调,该回调接受promise(heroesPromise)的输出,并将其分配给this.heroes成员变量.