Angular設(shè)計模式hierarchical?injector實現(xiàn)代碼復(fù)用模塊化
Angular 的 "dependency injection"
Angular 的 "dependency injection" 是一種設(shè)計模式,它可以幫助我們更有效地組織和共享代碼。在 Angular 中,我們可以通過注入服務(wù)(一個常見的可注入對象類型)到組件、指令或其他服務(wù)中,實現(xiàn)代碼的復(fù)用和模塊化。
Angular 的注入器系統(tǒng)是分層級的,也被稱為 "hierarchical injector"。這意味著你可以在不同的層級創(chuàng)建和注入服務(wù),從而決定它們的作用范圍和共享行為。
工作原理
舉個例子,假設(shè)你有一個 LoggerService 用于記錄應(yīng)用的日志信息。你可以在應(yīng)用的根模塊 AppModule 中提供這個服務(wù):
import { LoggerService } from './logger.service';
@NgModule({
providers: [ LoggerService ],
...
})
export class AppModule { }這樣,LoggerService 就成了一個單例服務(wù),整個應(yīng)用只會有一個 LoggerService 實例。你可以在任何需要的地方注入這個服務(wù):
import { LoggerService } from './logger.service';
@Component({
...
})
export class SomeComponent {
constructor(private logger: LoggerService) {
this.logger.log('Hello World!');
}
}然而,有時候你可能希望在某個特定的組件及其子組件中使用一個獨立的 LoggerService 實例。這時,你就可以在那個組件的元數(shù)據(jù)中提供 LoggerService:
import { LoggerService } from './logger.service';
@Component({
providers: [ LoggerService ],
...
})
export class SomeSpecificComponent {
constructor(private logger: LoggerService) {
this.logger.log('Hello Specific World!');
}
}在這種情況下,SomeSpecificComponent 及其所有子組件中注入的 LoggerService 都會是這個新的實例,而不是在 AppModule 中提供的單例。
這就是 Angular 的 "hierarchical injector" 的工作原理。每個注入器都有一個父注入器,當(dāng)你嘗試在某個組件中注入服務(wù)時,Angular 會首先在該組件的注入器中查找該服務(wù),如果沒找到,就會去父注入器中查找,這個過程會一直持續(xù)到根注入器。如果在整個過程中都沒找到該服務(wù),Angular 就會拋出錯誤。
以上就是Angular設(shè)計模式hierarchical injector實現(xiàn)代碼復(fù)用模塊化的詳細(xì)內(nèi)容,更多關(guān)于Angular hierarchical injector的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
詳解基于Angular4+ server render(服務(wù)端渲染)開發(fā)教程
本篇文章主要介紹了詳解基于Angular4+ server render(服務(wù)端渲染)開發(fā)教程 ,具有一定的參考價值,有興趣的可以了解一下2017-08-08
解決angular2 獲取到的數(shù)據(jù)無法實時更新的問題
今天小編就為大家分享一篇解決angular2 獲取到的數(shù)據(jù)無法實時更新的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08

