標籤：
什麼是 AngularJS?
AngularJS 是一個為動態WEB應用設計的結構架構。它能讓你使用HTML作為範本語言，通過擴充HTML的文法，讓你能更清楚、簡潔地構建你的應用組件。它的創新點在於，利用 資料繫結 和 依賴注入，它使你不用再寫大量的代碼了。
AngularJS是為了克服HTML在構建應用上的不足而設計的。HTML是一門很好的為靜態文本展示設計的聲明式語言，但要構建WEB應用的話它就顯得乏力了。
通常，我們是通過以下技術來解決靜態網頁技術在構建Live App上的不足：
類庫 - 類庫是一些函數的集合，它能協助你寫WEB應用。起主導作用的是你的代碼，由你來決定何時使用類庫。類庫有：jQuery等
架構 - 架構是一種特殊的、已經實現了的WEB應用，你只需要對它填充具體的商務邏輯。這裡架構是起主導作用的，由它來根據具體的應用邏輯來調用你的代碼。架構有：knockout、Backbone等。
AngularJS使用了不同的方法，它嘗試去補足HTML本身在構建應用方面的缺陷。AngularJS通過使用我們稱為標識符(directives)的結構，讓瀏覽器能夠識別新的文法。例如：
使用雙大括弧{{}}文法進行資料繫結；
使用DOM控制結構來實現迭代或者隱藏DOM片段；
支援表單和表單的驗證；
能將邏輯代碼關聯到相關的DOM元素上；
能將HTML分組成可重用的組件。
AngularJS通過為開發人員呈現一個更高層次的抽象來簡化應用的開發。如同其他的抽象技術一樣，這也會損失一部分靈活性。換句話說，並不是所有的應用都適合用AngularJS來做。AngularJS主要考慮的是構建CRUD應用。幸運的是，至少90%的WEB應用都是CRUD應用。但是要瞭解什麼適合用AngularJS構建，就得瞭解什麼不適合用AngularJS構建。如遊戲，圖形介面編輯器，這種DOM操作很頻繁也很複雜的應用，和CRUD應用就有很大的不同，它們不適合用AngularJS來構建。像這種情況用一些更輕量、簡單的技術如jQuery可能會更好。
一個簡單的AngularJS執行個體
index.html:
<!doctype html><html ng-app> <head> <script src="http://code.angularjs.org/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:
function InvoiceCntl($scope) { $scope.qty = 1; $scope.cost = 19.95;}
在html標籤裡, 我們用一個ng-app標識符標明這是一個AngularJS應用。這個ng-app標識符會使AngularJS自動初始化你的應用。 我們用script標籤來載入AngularJS指令碼： <script src="http://code.angularjs.org/angular-1.1.0.min.js">
通過設定<input>標籤裡的ng-model屬性, AngularJS會自動對資料進行雙向繫結。我們還同時進行了一些簡單的資料驗證：
當頁面載入完後，AngularJS會依照input標籤中聲明的模型名字（qty、cost）產生同名變數。你可以把這些變數認為是MVC設計模式中的M(Model)；
注意上面的input元素有著特殊的能力。如果你們沒有輸入資料或者輸入的資料無效，這個input輸入框會自動變紅。輸入框的這種新特性，能讓開發人員更容易實現CRUD應用裡常見的欄位驗證功能。
最後，我們可以來看一下這個神秘的雙大括弧{{}}了:這個{{運算式}}標記是AngularJS的資料繫結。其中的運算式可以是運算式和過濾器{{ expression | filter }}的組合。AngularJS提供了過濾器來對輸入輸出資料格式化。
上面的這個例子裡，{{}}裡的運算式讓AngularJS把從輸入框中獲得的資料相乘，然後把相乘結果格式化成本地貨幣樣式，然後輸出到頁面上。
值得一提的是，我們既沒有調用任何AngularJS的方法，也沒有像用架構一樣去編寫某個具體邏輯，就完成了上述功能。這個實現的背後是因為瀏覽器做了比以往生 靜態頁面更多的工作，讓它能滿足動態WEB應用的需要。AngularJS使得動態WEB應用的開發門檻降到不需要類庫或者架構的程度。
AngularJS的理念
Angular信奉的是，當組建視圖(UI)同時又要寫軟體邏輯時，聲明式的代碼會比命令式的代碼好得多，儘管命令式的代碼非常適合用來表述商務邏輯。
AngularJS能將你從以下的噩夢中解脫出來：
angular是MVVM模式中的佼佼者，而且是google主持開發的，未來會有更大的可能性。
加油！
AngularJS開發指南1：AngularJS簡介
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
