Angular2學習筆記-ng中的依賴注入

依賴注入能幫助我們管理對象,種種好處這里就不說了,主要記錄下angular2中的依賴注入。部分代碼直接來自angular中文官網。

基本依賴注入

@Injectable()
export class Logger {
  logs: string[] = []; 
  log(message: string) {
    this.logs.push(message);
    console.log(message);
  }
}

使用@Injectable()修飾符,這樣ng依賴注入器便能根據需要注入該類。

要使用該類,還需要對該服務進行注冊providers: [ Logger ],可以在模塊中的提供商中聲明,也可以在需要使用該服務的組件中聲明。

聲明后就能直接使用該服務了,ng注入器會為我們實例化該類:

constructor(private logger:Logger){}

大多數(shù)情況下可以這樣寫,當然也能直接從注冊器中獲取對象this.logger = this.injector.get(Logger);

服務提供商provider

providers: [ Logger ]是注冊服務提供商[{ provide: Logger, useClass: Logger }]的一種簡寫方式。

provide是令牌 (token),它作為鍵值 (key) 使用,它需要是一個typescript類,而不能是接口,因為js中不支持接口
useClass是實際的類型,因此我們也可以使用其他類型,BetterLogger,只要其與Logger有相同的接口

export class BetterLogger{
    logs: string[] = [];
    log(msg: string){
        console.log("better logger");
    }
}

可以使用providers: [BetterLogger, {provide:Logger, useExisting:BetterLogger} ]的方式來實現(xiàn)別名提供商,在接口改進或提升中有作用。
[{ provide: Logger, useValue: silentLogger }]為值提供商,silentLogger 為一個對象,該對象與Logger有相同的屬性及行為聲明。

工廠提供商

以上注入器為實例化對象都不涉及參數(shù),當需要指定的參數(shù)來實例化對象是則可以使用工廠提供商。

export class FactoryLogger{
    constructor(private isAuthorized:boolean){}
    logs: string[] = [];
    log(msg: string){
        console.log("factory logger");
        if(this.isAuthorized){
            console.log('authorized');
        }
    }
}

export let LoggerFactory=(authorized:Authorized) => {return new FactoryLogger(authorized.isAuthorized())};

@Injectable()
export class Authorized{
    isAuthorized(){
        return true;
    }
}

在providers注冊方式為providers: [Authorized,{provide: Logger, useFactory:LoggerFactory, deps:[Authorized]} ]

FactoryLogger服務需要一個bool值來實例化,我們提供了一個工廠方法LoggerFactory,該方法接收一個Authorized服務對象,并從該對象中獲取bool值。
useFactory為使用的工廠方法,deps我需要的其他服務。

非類提供商

有是我們的依賴僅僅為一個對象,而不是類的情況下,我們可以使用非類提供商,假設有以下配置對象:

export interface AppConfig {
  apiEndpoint: string;
  title: string;
}

export const HERO_DI_CONFIG: AppConfig = {
  apiEndpoint: 'api.heroes.com',
  title: 'Dependency Injection'
};

接口不能作為提供商的key,因此[{ provide: AppConfig, useValue: HERO_DI_CONFIG })]配置的方式是行不通的。
可以通過OpaqueToken類來使用字符串作為注冊服務提供商的鍵:

import { OpaqueToken  } from '@angular/core';
export let APP_CONFIG = new OpaqueToken('app.config'); 

使用方式如下

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [{ provide: APP_CONFIG, useValue: HERO_DI_CONFIG }]
})
export class AppComponent{
  title = 'app works!';
  constructor(@Inject(APP_CONFIG) config: AppConfig) {
    this.title = config.url;
  }
}

一些相關修飾符

1.@Optional()當沒有注冊提供商時,會設置注入的對象為null而不報錯,用在要注冊的對象前。
2.@Inject(APP_CONFIG) 參數(shù)修飾符聲明一個依賴。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 引言 依賴注入,有后端背景的童鞋(尤其是熟悉java spring框架的)應該不會陌生,提到依賴注入,就不得不說一...
    OnePiece索隆閱讀 3,587評論 0 4
  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,695評論 19 139
  • 版本:Angular 5.0.0-alpha 依賴注入是重要的應用設計模式。它使用得非常廣泛,以至于幾乎每個人都稱...
    soojade閱讀 3,078評論 0 3
  • 學習資料來自 Angular.cn 與 Angular.io。 本章在線例子 依賴注入 (Dependency i...
    小鐳Ra閱讀 1,557評論 0 2
  • 世界上本沒有路,走的人多了便成了路。路沒有盡頭,遇山劈山,遇河架橋,就會勇往直前。但是這路并非都是我們常人能夠一直...
    長白王德軍閱讀 461評論 0 0

友情鏈接更多精彩內容