为什么在Angular2中将服务注入组件时需要构造函数

时间:2017-03-17 11:41:16

标签: angular service

我正在关注https://angular.io学习Angular2。在经历"服务"章节,我无法理解为什么在组件中导入服务后我们需要以下代码: -

constructor(private heroService: HeroService) { }

为什么我们不能直接在Component中使用HeroService,就像我们在Hero字段中所做的那样:

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

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

由于

3 个答案:

答案 0 :(得分:2)

除了使当前代码文件知道名称之外,导入并不会做太多事情,但这本身并没有为您的应用程序添加任何功能。

对于服务类,您需要一个实例。您可以使用new MyService()创建它。但如果它具有依赖关系,例如Http,则需要使用new MyService(new Http()。因为Http本身有许多依赖关系,所以这很快失控。

constructor(private heroService: HeroService) { }

你告诉Angulars DI从它找到的下一个提供中传递一个HeroService实例,并且还传递它从HeroServiceconstructor参数和构造函数参数中发现的所有依赖关系这些参数直到所需的一切都得到解决。

您可以在https://en.wikipedia.org/wiki/Inversion_of_control

中详细了解一般原则

答案 1 :(得分:1)

服务总是需要在构造函数中调用才能在组件中使用它们。将构造函数视为收集和准备组件在组件加载之前将使用的每个服务的东西。

答案 2 :(得分:1)

Hero只是一个对象,因此您可以直接使用它

const hero = new Hero() // works fine

使用HeroService,您正在使用依赖注入。这就是DI通过在构造函数中声明服务而与Angular一起工作的方式。您可以使用不使用DI的服务,比如说

class NoDIService() {
  add(x, y) { return x + y; }
}

你可以在没有DI的情况下使用它,就像你对Hero所做的那样:

const myService = new NoDIService();

但是当您需要使用angular的内置功能时,您将使用依赖注入并使用DI注册您的服务...