欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Angular6新版功能介绍之service的共享实例

程序员文章站 2023-03-26 22:32:33
angular 6+ 之新版service angular 6已经发布了,angular 6中有一些新功能,其中一个就是提供service的共享实例。 回首angular 5-...

angular 6+ 之新版service

angular 6已经发布了,angular 6中有一些新功能,其中一个就是提供service的共享实例。

回首angular 5-

下面是一段熟悉的代码,可以为整个应用程序提供服务。我们将它添加到appmodule中的providers[]。

自定义服务类

// data.service.ts
export class dataservice { ... }

共享全局使用

// in app.module.ts

import { dataservice } from './path/to/data.service';
@ngmodule({
  declarations: [...],
  providers: [dataservice],
  bootstrap: [appcomponent]
})
export class appmodule {}

dataservice是自定义的一个服务。

展望angular 6+

以前的angular 5之前的为全局提供共享服务的方式仍然有效,也就是这种方式适用于angular 6+。

现在angular提供了另一种方法,使服务可用于整个应用程序。

自定义服务类

// data.service.ts
@injectable({
  providedin: 'root',
})
export class dataservice { ... }

共享全局使用

// in app.module.ts
@ngmodule({
  declarations: [...],
  providers: [], // no need to add service here.
  bootstrap: [appcomponent]
})
export class appmodule {}

此时我们注意到上述代码中增加了 @injectable() 语句,并设置了 providedin 元数据值为 ‘root’。

@injectable({
  providedin: 'root',
})

如果你在根级别提供service时,angular会创建一个服务的单个共享实例,并注入任何需求它的类内。providedin: ‘root’ 指在根注入器中提供service。