AngularJS誕生於2009年，由Misko Hevery 等人創建，是一款構建用戶界面的前端框架，後為Google所收購。Angular是AngularJS的重寫，Angular2以後官方命名為Angular，2.0以前版本稱為AngularJS。AngularJS是用JavaScript編寫，而Angular採用TypeScript語言編寫，是ECMAScript 6的超集。
Angular是一個套用設計框架與開發平台，用於創建高效、複雜、精緻的單頁面套用，通過新的屬性和表達式擴展了 HTML，實現一套框架，多種平台，移動端和桌面端。Angular有著諸多特性，最為核心的是：MVVM、模組化、自動化雙向數據綁定、語義化標籤、依賴注入等等。
基本介紹
產生背景,語言特點,主要功能,語言風格,
產生背景
AngularJS是為了克服HTML在構建套用上的不足而設計的。HTML是一門很好的為靜態文本展示設計的聲明式語言，但要構建WEB套用的話它就顯得乏力了。所以做了一些工作（可以覺得是小花招）來讓瀏覽器做想要的事。通常，是通過以下技術來解決靜態網頁技術在構建動態套用上的不足：
Angular Logo變化過程
類庫 - 類庫是一些函式的集合，它能幫助寫WEB套用。起主導作用的是代碼，來決定何時使用類庫。類庫有：jQuery等
AngularJS使用了不同的方法，它嘗試去補足HTML本身在構建套用方面的缺陷。AngularJS通過使用稱為指令(directives)的結構，讓瀏覽器能夠識別新的語法。例如：
使用雙大括弧{{}}語法進行數據綁定；
支持表單和表單的驗證；
能將邏輯代碼關聯到相關的DOM元素上；
能將HTML分組成可重用的組件。
語言特點
AngularJS試圖成為WEB套用中的一種客戶端的解決方案。這意味著它不只是WEB套用中的一個小部分，還是一個完整的客戶端的解決方案。這會讓AngularJS在構建一個CRUD（增加Create、查詢Retrieve、更新Update、刪除Delete）的套用時顯得很“固執”（原文為 opinionated,意指沒有太多的其他方式）。但是，儘管它很“固執”，它仍然能確保它的“固執”只是在構建套用的起點，並且仍能靈活變動。AngularJS的一些出眾之處如下：
具有目錄布局和測試腳本的種子套用作為起點。
主要功能
AngularJS通過為開發者呈現一個更高層次的抽象來簡化套用的開發。如同其他的抽象技術一樣，這也會損失一部分靈活性。換句話說，並不是所有的套用都適合用AngularJS來做。AngularJS主要考慮的是構建CRUD套用。幸運的是，至少90%的WEB套用都是CRUD套用。但是要了解什麼適合用AngularJS構建，就得了解什麼不適合用AngularJS構建。
下面是一個包含了一個表單的典型CRUD套用。表單值先經過驗證，然後用來計算總值，這個總值會被格式化成本地的樣式。下面有一些開發者常見的概念，需要先了解一下：
1.將數據模型(data-model)關聯到視圖(UI)上；
2.寫、讀、驗證用戶的輸入；
3.根據模型計算新的值；
4.將輸出格式本地化，
index.html:
<!doctype html>
<html ng-app>
<head>
<script src="angular-1.1.0.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div ng-controller="InvoiceCntl">
<b>Invoice:</b>
<br>
<br>
<table>
<tr><td>Quantity</td><td>Cost</td></tr>
<tr>
<td><input type="integer" min="0" ng-model="qty" required ></td>
<td><input type="number" ng-model="cost" required ></td>
</tr>
</table>
<hr>
<b>Total:</b> {{qty * cost | currency}}
</div>
</body>
</html>
script.js
試一下上面這個例子。然後一起來看下這個例子的工作原理。
在標籤里，用一個ng-app標識符標明這是一個AngularJS套用。這個ng-app標識符會使AngularJS自動初始化(auto initialize)你的套用。
用標籤來載入AngularJS腳本：
Quantity:Cost:這個輸入框的widget看起來很普通，但如果認識到以下幾點那它就不普通了：
當頁面載入完後，AngularJS會依照widget里的聲明的模型名字（qty、cost）生成同名變數。你可以把這些變數認為是MVC設計模式中的M(Model)；
終於，我們可以來看一下神秘的雙大括弧{{}}了:
Total:{{qty *cost |currency}}這個{{表達式}}標記是AngularJS的數據綁定。其中的表達式可以是表達式和過濾器({{ expression | filter }})的組合。AngularJS提供了過濾器來對輸入輸出數據格式化。
上面的這個例子裡，{{}}里的表達式讓AngularJS把從輸入框中獲得的數據相乘，然後把相乘結果格式化成本地貨幣樣式，然後輸出到頁面上。
值得一提的是，我們既沒有調用任何AngularJS的方法，也沒有像用框架一樣去編寫某個具體邏輯，就是完成了上述功能。這個實現的背後是因為瀏覽器做了比以往生成 靜態頁面更多的工作，讓它能滿足動態WEB套用的需要。AngularJS使得動態WEB套用的開發門檻降到不需要類庫或者框架的程度。
語言風格
將測試和開發同等看待是一種非常非常好的思路，測試的難度在很大程度上取決於代碼的結構；
將客戶端和伺服器端解耦是一種特別好的做法，它能使兩邊並行開發，並且使兩邊代碼都能實現重用；
如果框架能夠在整個開發流程里都引導著開發者：從設計UI，到編寫業務邏輯，再到測試，那對開發者將是極大的幫助；
“化繁為簡，化簡為零”總是好的。
AngularJS能將你從以下的噩夢中解脫出來：
使用回調：回調的使用會打亂你的代碼的可讀性，讓你的代碼變得支離破碎，很難看清本來的業務邏輯。移除一些常見的代碼，例如回調，是件好事。大幅度地減少你因為JavaScript這門語言的設計而不得不寫的代碼，能讓你把自己套用的邏輯看得更清楚。
手動編寫操作DOM元素的代碼：操作DOM是AJAX套用很基礎的一部分，但它也總是很“笨重”並且容易出錯。用聲明的方式描述的UI界面可隨著套用狀態的改變而變化，能讓你從編寫低級的DOM操作代碼中解脫出來。絕大部分用AngularJS寫的套用里，開發者都不用再自己去寫操作DOM的代碼，不過如果你想的話還是可以去寫。
對UI界面讀寫數據：AJAX套用的很大一部是CRUD操作。一個經典的流程是把服務端的數據組建成內部對象，再把對象編成HTML表單，用戶修改表單後再驗證表單，如果有錯再顯示錯誤，然後將數據重新組建成內部對象，再返回給伺服器。這個流程里有太多太多要重複寫的代碼，使得代碼看起來總是在描述套用的全部執行流程，而不是具體的業務邏輯和業務細節。
開始前得寫大量的基礎性的代碼：通常你需要寫很多的基礎性的代碼才能實現一個“Hello World”的套用。用AngularJS的話，它會提供一些服務讓你很容易地正式開始寫你的套用，而這些服務都是以一種Guice-like dependency-injection式的依賴注入自動加入到你的套用中去的，這讓你能很快的進入你套用的具體開發。特別的是，你還能全盤掌握自動化測試的初始化過程。
AngularJS 表達式寫在雙大括弧內：{{ expression }}。
AngularJS 表達式把數據綁定到 HTML，這與ng-bind指令有異曲同工之妙。
AngularJS 將在表達式書寫的位置"輸出"數據。
AngularJS 表達式很像JavaScript 表達式：它們可以包含文字、運算符和變數。
實例 {{ 5 + 5 }} 或 {{ firstName + " " + lastName }}
