angular 2+ 点点滴滴angular2Angular 4.x 修仙之路

Angular2的服务

2017-08-05  本文已影响83人  云峰yf

前言

服务是NG的另一个核心部分,它充当了前端MV*结构中的M,它能够给其它构建块提供全局支持,并且使用依赖注入的方式进行工作。

依赖注入

这个概念借鉴于后端Java的Spring框架,只为解决一个全局共享对象的问题:项目中往往需要一个全局对象,总不能要一个new一个吧,如果需要的时候直接用同一个不方便多了?
为了解决这个全局共享对象的问题,依赖注入的思想提供了很好的解决方案。其实它就是单例模式。

使用

@Injectable()
export class myService {
...
}

providers: [myService]
constructor(private mySvc: myService) {
...
}

提供商分类

要使用服务,首先要在模块里声明提供商。如果有更加定制化的需求,需要引入令牌。

令牌用来标识依赖项和提供者。是一种解决应用不同部分,可能使用相同的令牌来标识不同的服务的方案。

export const MY_SERVICE = new OpaqueToken("logger");
providers: [{ provide: MY_SERVICE, useClass: MyService }]
constructor( @Inject(MY_SERVICE) private mySvc: MyService) { }

使用类指定服务,全局共享一个对象

providers: [{ provide: MyService, useClass: MyService }]

使用对象指定服务,这时候不再共享同一个对象,而是单独实例化一个提供商

let my = new MyService();
providers: [{ provide: MyService, useValue: my}]

使用一个函数指定一个服务,在单独实例化一个提供商的基础上再自定义一些信息

providers: [{
    provide: MyService, useFactory: () => {
        let my= new MyService();
        my.level = 2;
        return my;
    }
}]

使用另一个服务指定一个服务,相当于是别名。

providers: [MyService,{ provide: otherService, useExisting: MyService }]

总结

NG的服务把传统前端开发中的和数据有关的部分抽离出来,成为一个单例供全局使用,解决了前端开发中管理数据流的痛点。

上一篇下一篇

猜你喜欢

热点阅读