Angular

Angular（通常是指 "Angular 2+" 或 "Angular v2 及更高版本"）是一個基於TypeScript的開源Web應用框架，由Google的Angular團隊以及社區共同開發。Angular是由AngularJS的開發團隊完全重寫的。

## Angular和AngularJS之間的區別

<image>

在設計上，Angular是AngularJS的完全重寫。

- Angular 捨棄了AngularJS中「作用域(`$scope`)」或控制器(Controller)的概念，其架構中的主要角色是一些層次化的組件。
- Angular 具有不同的表達式語法，主要是用 `[]` 來表示屬性綁定，以及用 `()` 來表示事件綁定。例如`<input [type]="typeAttr" (blur)="save()" />`。
- 模塊化 – 許多核心功能都已模塊化，使用時一般分為AppModule(項目模塊)和SharedModule(共享/依賴模塊)。
- 指令(Directives)，Angular.js的指令只能進行雙向數據綁定，而Angular控制嚴密可以進行單向綁定，生命周期鉤子也更加豐富。
- 純管道(Pure Pipes)，Angular.js的`.filter()`管道觸發頻繁，而Angular的純管道只監聽管道所綁定的值發生純變更。
- Angular 建議使用 Microsoft 的 TypeScript 語言，該語言引入了如下特性：
- 靜態類型，包括泛型
- 裝飾器，語法上類似於註解
- TypeScript 是 ECMAScript 6 (ES6) 的超集，並且與 ECMAScript 5 (即 JavaScript) 向下兼容。
- 動態加載
- 異步模板編譯
- RxJS 提供了迭代式回調。RxJS 在狀態可見性和調試方面有局限，不過可以使用諸如 ngReact 或 ngrx 之類的響應式第三方庫來解決這些問題。
- 支持 Angular Universal，它可以在伺服器上運行 Angular 應用程式。
- 支持HMR（熱模塊替換）（在v19以上版本），將編譯修改的樣式或模板直接發送到瀏覽器，無需刷新頁面，不會丟失任何狀態。

## 歷史

### 命名

最初，團隊將這份 AngularJS 的重寫版本稱為 「Angular 2」，但這在開發人員之間引起了混亂。為了明確起見，該團隊宣布應該為這兩個框架分別使用各自的術語，其中 「AngularJS」專指 1.X 版本，而不帶 「JS」的 「Angular」則專指版本2及更高版本。

### 版本 2

在2014年10月22~23日的 ng-Europe 會議上發布了Angular 2.0。2.0 版的重大變化在開發人員之間引起了很大爭議。2015年4月30日，Angular 開發組宣布 Angular 2 從 Alpha 推進到 Developer Preview。Angular 2 於2015年12月推進至 Beta 版，並於 2016年5月發布了首個 rc 版本。其最終版本於2016年9月14日發布。

### 版本 4

2016年12月13日發布了 Angular 4，它跳過了版本號 3，以免由於路由模塊的版本的未和其它模塊對齊而造成混淆（路由模塊在之前已經作為 v3.3.0 發布了）。其最終版本於2017年3月23日發布。Angular 4 向後兼容 Angular2。

Angular 4.3 版是次要版本，這意味著它沒有破壞性變更，是 4.xx 的直接替代品。

版本 4.3 中的特性

- 引入了 HttpClient，這是一個更小、更易於使用且功能更強大的庫，可用於發起 HTTP 請求。
- 一些新的路由器生命周期事件，用於追蹤守衛和解析過程。生命周期事件（比如 NavigationStart）集合中加入了四個新事件：GuardsCheckStart, GuardsCheckEnd, ResolveStart, ResolveEnd。
- 有條件的禁用動畫。

### 版本 5

Angular 5 於2017年11月1日發布。Angular 5 的主要改進包括對漸進式 Web 應用的支持、一個構建優化器，以及一些與 Material Design 相關的改進。

### 版本 6

Angular 6 於2018年5月4日發布。這是一個主版本，其改進重點不在於底層框架，而在於工具鏈，其目的是讓工具鏈能在將來與 Angular 一起快速發展，改進點主要包括：ng update、ng add、Angular Elements、Angular Material + CDK 組件庫、Angular Material 初學者組件、CLI 工作空間、庫支持、服務提供商的搖樹優化、動畫性能改進，以及 RxJS v6。

### 版本 7

Angular 7 於2018年10月18日發布。其升級主要集中在 Angular Material & CDK、虛擬滾動、選擇框在無障礙方面的改進、支持對符合 Web 標準的自定義元素進行內容投影，以及對 Typescript 3.1、RxJS 6.3、Node 10 (仍然支持 Node 8) 的依賴庫更新。

### 版本 8

Angular 8 於2019年5月28日發布。特性包括：為所有應用代碼進行差異化加載、針對惰性加載路由的動態導入、Web workers、支持 TypeScript 3.4，並且把 Angular Ivy 作為可選的預覽特性。Angular Ivy 的可選預覽特性包括：

- 生成的代碼在運行時更易於閱讀和調試
- 更快的重新構建
- 改進了有效載荷的大小
- 改進了模板類型檢查
- 向後兼容

### 未來的版本

最值得期待的特性之一是 Ivy，它是一個向後兼容的、基於增量式 DOM 架構的全新渲染引擎。Ivy 從設計之初就考慮到了搖樹優化，這意味著應用的發布包中只會包含那些在應用中真正用到的 Angular 部件。

可以預期，每一個版本都會向後兼容前一個版本。Google 承諾每年會進行兩次升級。

### 支持政策與時間表

所有主版本都提供了 18 個月的支持。其中包括 6 個月的活躍支持，在此期間會定期發布更新和補丁。然後是12個月的長期支持（LTS），在此期間只會發布關鍵修復程序和安全補丁。

## 程式庫

### Angular Material

Angular Material 是一個 UI 組件庫，屬於 Official components for Angular 的一部分，它在 Angular 中實現了 Material Design。

Angular Material的側重點在於提供跨平台一致的、適配國際化的組件庫。

2024年5月23日發布了v18.0.0，代號satin-sasquatch(緞面大腳怪)，添加了基於M3的預建主題，將所有的SCSS變量和CSS變量加上m2_的前綴。

2024年11月20日發布了v19.0.0，代號hafnium-hippo(鉿河馬)，適配了支持增量水合和HMR的Angular19，共有37款組件。

## 另請參閱

- AngularJS
- React.js
- Vue.js
- Svelte
- Web應用框架

## 基本資料

- 開發者：Google
- 發行日期：2.0 / 2016年9月14日
- 程式語言：TypeScript
- 平台：Web 平台
- 類型：Web應用框架
- 許可協議：MIT許可證