angular6--------------服务

组件不应该直接获取或保存数据,它们不应该了解是否在展示假数据。 它们应该聚焦于展示数据,而把数据访问的职责委托给某个服务。服务是在多个“互相不知道”的类之间共享信息的好办法,采用依赖注入机制讲服务注入到组件中去。

开始使用

创建共享服务

ng generate service hero

结果如下:

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',   // 表示提供商注册到顶层根注入器上,当你在顶层提供该服务时,Angular 就会为 HeroService 创建一个单一的、共享的实例,并把它注入到任何想要它的类上
})
export class HeroService {

  constructor() { }

}

   组件中使用服务(三个步骤)

  • 导入 HeroService 服务

import { HeroService } from '../hero.service';
  • 声明 HeroService 服务

@Component({
  selector: 'app-hero',
  ...
  providers: [HeroService]
})
  • 注入 HeroService 服务--采用依赖注入机制

export class HeroComponent implements OnInit {
  constructor(private heroService: HeroService) { }
}

 

你可能感兴趣的:(Angular)