《英雄指南》继续前行。接下来，我们准备添加更多的组件。
将来会有更多的组件访问英雄数据，我们不想一遍一遍地复制粘贴同样的代码。 解决方案是，创建一个单一的、可复用的数据服务，然后学着把它注入到那些需要它的组件中去。
我们将重构数据访问代码，把它隔离到一个独立的服务中去，让组件尽可能保持精简，专注于为视图提供支持。 在这种方式下，借助模拟服务来对组件进行单元测试也会更容易。
因为数据服务通常都是异步的，我们将在本章创建一个基于承诺 (Promise)的数据服务。
当然，一开始我们还是要让我们的程序运行起来。在终端输入
npm start
创建英雄服务
客户向我们描绘了本应用更大的目标：想要在不同的页面中用多种方式显示英雄。 现在我们已经能从列表中选择一个英雄了，但这还不够。 很快，我们将添加一个仪表盘来显示表现最好的英雄，并创建一个独立视图来编辑英雄的详情。 所有这些视图都需要英雄数据。
目前，AppComponent显示的是模拟数据。 至少有两个地方可以改进： 首先，定义英雄的数据不该是组件的任务； 其次，想把这份英雄列表的数据共享给其它组件和视图可不那么容易。
我们可以把获取英雄数据的任务重构为一个单独的服务，它将提供英雄数据，并把服务在所有需要英雄数据的组件间共享。
创建 HeroService
在app目录下创建一个名叫hero.service.ts的文件。
我们的文件名遵循的规则是，小写的服务器名称加上.service后缀，如果服务名称包含多个单词，我们就把基本名部分写成中线形式 (dash-case)。 例如，SpecialSuperHeroService服务应该被定义在special-super-hero.service.ts文件中。
我们把这个类命名为HeroService，并导出它，以供别人使用。
app/hero.service.ts
import { Injectable } from '@angular/core';
@Injectable()
export class HeroService {
}