依賴注入（DI）是Angular 框架的核心機(jī)制，通過外部提供依賴對(duì)象而非自行創(chuàng)建，降低類間耦合。 1. DI 通過構(gòu)造函數(shù)參數(shù)自動(dòng)傳入依賴實(shí)例，如constructor(private service: DataService)；2. Angular 支持多級(jí)註入器：根注入器（providedIn: 'root'）提供全局單例服務(wù)，模塊/組件級(jí)註入器限制服務(wù)作用域；3. 常見註入方式包括構(gòu)造函數(shù)注入（最常用）、屬性注入和方法參數(shù)注入；4. 注意事項(xiàng)包含避免循環(huán)依賴、防止重複提供服務(wù)導(dǎo)致非單例問題，以及使用APP_INITIALIZER 處理異步初始化邏輯。掌握DI 能提升代碼可維護(hù)性、測(cè)試性和對(duì)框架機(jī)制的理解。

Angular 的依賴注入（Dependency Injection，簡(jiǎn)稱DI）是框架核心的一部分，它讓組件和服務(wù)之間的協(xié)作變得更簡(jiǎn)單、更靈活。如果你剛開始接觸Angular，DI 可能看起來有點(diǎn)抽象，但其實(shí)它的原理很直觀：不是自己創(chuàng)建依賴對(duì)象，而是由外部提供。

下面我們就從幾個(gè)實(shí)用角度來聊聊Angular 的依賴注入到底是怎麼工作的。

什麼是依賴注入？

在寫代碼時(shí)，如果一個(gè)類需要用到另一個(gè)類的功能，我們就說它“依賴”於那個(gè)類。比如一個(gè)組件可能需要一個(gè)服務(wù)來獲取數(shù)據(jù)。

如果不使用依賴注入，你可能會(huì)這樣寫：

 class MyComponent {
  service = new DataService();
}

這雖然能工作，但有個(gè)問題： MyComponent和DataService耦合太緊了。如果我們以後想換一個(gè)不同的數(shù)據(jù)服務(wù)，就得修改這個(gè)類。

而用依賴注入的方式，我們把創(chuàng)建依賴的權(quán)力交給外部，自己只負(fù)責(zé)接收：

 class MyComponent {
  constructor(private service: DataService) {}
}

Angular 框架會(huì)自動(dòng)幫我們創(chuàng)建並傳入這個(gè)DataService實(shí)例，這就叫依賴注入。

Angular 中的依賴注入層級(jí)

Angular 的依賴注入系統(tǒng)支持多層注入器，你可以理解為“誰負(fù)責(zé)提供服務(wù)實(shí)例”。

主要有兩個(gè)級(jí)別：

• 根注入器（Root Injector） ：最頂層，整個(gè)應(yīng)用都能訪問。通常用providedIn: 'root'來註冊(cè)服務(wù)。
• 模塊級(jí)或組件級(jí)註入器（Lazy Injector） ：某個(gè)模塊或組件自己管理的服務(wù)，只有自己和子組件能訪問。

舉個(gè)例子：

 @Injectable({
  providedIn: 'root',
})
export class AppService {}

上面這個(gè)服務(wù)在整個(gè)應(yīng)用中都是單例的——無論你在哪裡註入它，拿到的都是同一個(gè)實(shí)例。

如果你想限制服務(wù)的作用範(fàn)圍，可以手動(dòng)把它加到某個(gè)模塊或組件的providers數(shù)組裡：

 @Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  providers: [LocalService],
})

這時(shí)候，每次使用這個(gè)組件都會(huì)創(chuàng)建一個(gè)新的LocalService實(shí)例。

如何注入依賴？

Angular 支持幾種常見的依賴注入方式：

• 構(gòu)造函數(shù)注入（Constructor Injection） ：最常見的做法，推薦用於大多數(shù)服務(wù)。
• 屬性注入（Property Injection） ：不常見，主要用於指令或組件之間傳遞值。
• 方法參數(shù)注入（Method Injection） ：不太常用，某些高級(jí)場(chǎng)景下才會(huì)用到。

構(gòu)造函數(shù)注入是最標(biāo)準(zhǔn)的做法，例如：

 constructor(private http: HttpClient, private route: ActivatedRoute) {}

只要你在構(gòu)造函數(shù)里聲明了這些依賴，並且它們已經(jīng)被正確註冊(cè)，Angular 就會(huì)自動(dòng)幫你創(chuàng)建並傳進(jìn)來。

常見問題和注意事項(xiàng)

1. 循環(huán)依賴問題

   • 如果A 依賴B，B 又依賴A，就會(huì)出現(xiàn)循環(huán)依賴。
   • Angular 在大多數(shù)情況下能處理這種問題，但在某些複雜結(jié)構(gòu)下可能報(bào)錯(cuò)。建議盡量避免強(qiáng)耦合的設(shè)計(jì)。

2. 服務(wù)不是單例？

   • 如果你發(fā)現(xiàn)每次注入的服務(wù)狀態(tài)都不一樣，可能是不小心在多個(gè)地方重複提供了這個(gè)服務(wù)。
   • 查看服務(wù)是否被錯(cuò)誤地放在多個(gè)組件的providers裡。

3. 異步初始化服務(wù)怎麼辦？

   • 有些服務(wù)需要在啟動(dòng)時(shí)做一些異步操作（比如加載配置），這時(shí)可以用APP_INITIALIZER這個(gè)機(jī)制來延遲應(yīng)用啟動(dòng)，直到服務(wù)準(zhǔn)備好。

基本上就這些。掌握好Angular 的依賴注入機(jī)制，不僅能讓你寫出更清晰、更容易測(cè)試的代碼，也能幫助你更好地理解和使用Angular 自帶的各種功能模塊。

以上是解釋角度依賴注射的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！