Angular 22 Signal 進化論
2026 iThome 鐵人賽・共 30 篇
相信講到前端框架，大家第一時間想到的通常會是 Vue、React，甚至也有人會推薦 Svelte 這類近年討論度很高的框架。但一講到 Angular，很多人的第一印象可能就像看到一座大城堡一樣：東西很多、規則很多，一時之…
- 01為什麼想聊 Angular Signal？
- 02Angular Signal 是什麼？從 Change Detection 理解它的運作原理
- 03從 set()、update() 看懂 Angular Signal 的基本使用與更新機制
- 04Angular 怎麼知道誰正在讀 Signal？從 Reactive Context 理解依賴追蹤
- 05從 Reactive Graph 到 View Tree，看 Angular 如何找到真正需要更新的畫面
- 06Resource API，把非同步資料帶進 Signal
- 07從 Resource 到 httpResource，用 Signal 管理 HTTP 資料請求
- 08用 Orval 串起 Angular API Contract，同時產生 HttpClient、httpResource 與 Zod
- 09httpResource 實務篇，統一回覆格式與 chain 相依請求
- 10linkedSignal 讓相依狀態也能被修改
- 11用 rxResource 串起 Observable 與 Resource
- 12從 httpResource 到 TanStack Query，認識 Server State
- 13從 Router Event 到 Signal
- 14Lazy Loading 不只一種，從 Router Preloading、@defer 到 injectAsync()
- 15搞懂 Injection Context，從 inject()、runInInjectionContext() 到 injectAsync()
- 16即將登場的 Route Resources，Angular Router 為什麼需要新的資料載入方式？
- 17effect() 不是拿來同步 Signal 的，Angular 的 Side Effect 該怎麼寫？
- 18Angular Signal Forms 穩定了，跟我們用了這麼久的 Reactive Forms 到底差在哪？
- 19Signal Forms Cross-field Validation 與欄位更新時機
- 20Signal Forms 非同步驗證，validateHttp 與 validateAsync
- 21Angular Template 還適合呼叫 Method 嗎？從 Pipe、RxJS 到 computed
- 22Angular Render Lifecycle，從 afterNextRender 到 DestroyRef
- 23RouteReuseStrategy，切換路由一定要銷毀 Component 嗎？
- 24SPA Router 為什麼不再只靠 History API？
- 25Angular SignalStore，原生 Signal 不夠用嗎？
- 26SignalStore 與 Strategy Pattern，透過 DI 動態切換業務邏輯
- 27NgRx Store vs SignalStore，從 Action、Reducer 到直接更新 State
- 28Angular 動態建立 Component，NgComponentOutlet 與 ViewContainerRef
- 29Angular 也有 VueUse？使用 Signality 整合常見 Browser API
- 30Angular Router Providers 與生命週期管理，路由離開後 Service 會銷毀嗎？