Angular 依賴注入語法進化論 🚀

從前從前... (Angular 15 之前)

在 Angular 的古代時期，是這樣注入依賴的：

constructor(private masterService: MasterService) {}

現代化改革！(Angular 15+)

新時代的注入方式簡單又時髦：

private masterService = inject(MasterService);

為什麼要改變？🤔

優點解析

• 👍 程式碼更簡潔俐落

• 🎯 避免建構函數排序的惱人問題

• 🎪 更好地支援 Standalone Components

• 🔧 提供更靈活的依賴注入方式

實戰範例

import { Component, inject } from '@angular/core';
import { MasterService } from './master.service';

@Component({
  selector: 'app-cool-feature',
  template: `
    <div>我是個很酷的功能！</div>
  `
})
export class CoolFeatureComponent {

  private masterService = inject(MasterService);
  
  doSomethingCool() {
    this.masterService.beAwesome();
  }
}

小提醒 ⚠️

• 別忘了 import { inject } from '@angular/core'

• 新舊語法都能用，但推薦使用新語法

• 特別適合搭配 Standalone Components 使用

結論

新的 inject 語法不只是語法糖，更是 Angular 現代化的重要一步。簡單、靈活、好用，不用白不用！ 🎉