脚本宝典收集整理的这篇文章主要介绍了Angular6的服务和依赖注入,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
- 通过把组件中和视图有关的功能与其他类型的处理分离开,你可以让组件类更加精简、高效。 理想情况下,组件的工作只管用户体验,而不用顾及其它。 它应该提供用于数据绑定的属性和方法,以便作为视图(由模板渲染)和应用逻辑(通常包含一些模型的概念)的中介者。
- 组件不应该定义任何诸如从服务器获取数据、验证用户输入或直接往控制台中写日志等工作。 而要把这些任务委托给各种服务。通过把各种处理任务定义到可注入的服务类中,你可以让它可以被任何组件使用。 通过在不同的环境中注入同一种服务的不同提供商,你还可以让你的应用更具适应性。
Angular 不会强制遵循这些原则。它只会通过依赖注入让你能更容易地将应用逻辑分解为服务,并让这些服务可用于各个组件中。
在Angular中使用服务,首先根据需要的功能,写一个服务类(angular中称为PRovider),然后将该服务类注册到注入器中(应用启动时自动创建),之后就可以在组件类或其他服务中通过Angular的依赖注入系统使用了,Angular会自动将该类实例化,并处理好依赖关系.
在Angular中有很多方式可以将服务类注册到注入器中:
- @Injectable 元数据中的
providedIn
属性
- @NgModule 元数据中的
providers
属性
- @component 元数据中的
providers
属性
不同的注册方式,生成的服务也有所不同.
-
在服务类的 @Injectable
装饰器中:
//service
@Injectable({
providedIn: 'root',
})
providedIn: 'root'
告诉 Angular在根注入器中注册这个服务,这也是使用CLI生成服务时默认的方式.
这种方式注册,不需要再@NgModule
装饰器中写providers
,而且在代码编译打包时,可以执行摇树优化,会移除所有没在应用中使用过的服务。推荐使用此种方式注册服务.
-
在模块@NgModule
中的 providers
//service
@Injectable()
//module
@NgModule({
providers: [
UserService,
{ provide: APP_config, useValue: HERO_DI_CONFIG }
],
})
这种方式注册,可以对服务进行一些额外的配置(服务类中也需要写@Injectable()装饰器).
-
在组件 @Component
中的 providers
@Component({
selector: 'app-heroes',
providers: [ HeroService ]
这种方式注册,会注册到每个组件实例自己的注入器上。(多个组件会有多个注入器)
- 不提供服务类
最常见的图纸是class,但是在配置providers: []
时,也可以不提供服务类,而是返回对象的工厂函数,或是对象字面量[{ provide: LOGger, useClass: Logger }]
也可以使用useValue
属性直接交付一个对象实例,[{ provide: Logger, useValue: silentLogger }]
以上是脚本宝典为你收集整理的Angular6的服务和依赖注入全部内容,希望文章能够帮你解决Angular6的服务和依赖注入所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。