AngularJS-入門篇
AngularJS是什麼?html
既然能找到這篇日誌，證實你們已經瞭解AngularJS了我這裏也就不長篇大論的說了。angularjs
其實AngularJS就是，使用JavaScript編寫的客戶端技術。和Web技術（ HTML、 CSS 和JavaScript）配合使用，使Web應用開發比以往更簡單、更快捷。
剛開始學習，我們得有學的工具，這裏建議推薦使用vs，版本無所謂 後面的demo ，我這裏基本上都會使用vs2013來進行開發。
說了這麼多，一塊兒來寫一個小demo，開始我們神奇的AngularJS之旅吧。
1.先下載包：http://files.cnblogs.com/files/xiaowei0705/angular.min.js
2新建一個頁面，寫入如下代碼：
<!doctype html>
<html ng-app>
<head>
<script src="Scripts/angular.min.js"></script>
</head>
<body>
姓名： <input type="text" ng-model="yourname" placeholder="請輸入姓名">
<hr>
你好： {{yourname || '小偉'}}!
</body>
</html>express
運行結果：
我們頁面沒有作任何的js處理，竟然能自動改變！設計模式
該示例有一下幾點重要的注意事項：數組
- 文本輸入指令
<input ng-model="yourname" />綁定到一個叫yourname的模型變量。 - 雙大括號標記將
yourname模型變量添加到問候語文本。 - 你不須要爲該應用另外註冊一個事件偵聽器或添加事件處理程序！
如今試着在輸入框中鍵入您的名稱，您鍵入的名稱將當即更新顯示在問候語中。 這就是AngularJS雙向數據綁定的概念。 輸入框的任何更改會當即反映到模型變量（一個方向），模型變量的任何更改都會當即反映到問候語文本中（另外一方向）。瀏覽器
AngularJS應用的解析
本節描述AngularJS應用程序的三個組成部分，並解釋它們如何映射到模型-視圖-控制器設計模式：緩存
模板（Templates）
模板是您用HTML和CSS編寫的文件，展示應用的視圖。 您可給HTML添加新的元素、屬性標記，做爲AngularJS編譯器的指令。 AngularJS編譯器是徹底可擴展的，這意味着經過AngularJS您能夠在HTML中構建您本身的HTML標記！app
應用程序邏輯（Logic）和行爲（Behavior）
應用程序邏輯和行爲是您用JavaScript定義的控制器。AngularJS與標準AJAX應用程序不一樣，您不須要另外編寫偵聽器或DOM控制器，由於它們已經內置到AngularJS中了。這些功能使您的應用程序邏輯很容易編寫、測試、維護和理解。工具
模型數據（Data）
模型是從AngularJS做用域對象的屬性引伸的。模型中的數據多是Javascript對象、數組或基本類型，這都不重要，重要的是，他們都屬於AngularJS做用域對象。學習
AngularJS經過做用域來保持數據模型與視圖界面UI的雙向同步。一旦模型狀態發生改變，AngularJS會當即刷新反映在視圖界面中，反之亦然。
此外，AngularJS還提供了一些很是有用的服務特性：
- 底層服務包括依賴注入，XHR、緩存、URL路由和瀏覽器抽象服務。
- 您還能夠擴展和添加本身特定的應用服務。
- 這些服務可讓您很是方便的編寫WEB應用。
代碼在作什麼呢？
ng-app指令：
<html lang="en" ng-app>
ng-app指令標記了AngularJS腳本的做用域，在<html>中添加ng-app屬性即說明整個<html>都是AngularJS腳本做用域。開發者也能夠在局部使用ng-app指令，如<div ng-app>，則AngularJS腳本僅在該<div>中運行。
AngularJS腳本標籤：
<script src="lib/angular/angular.js"></script>
這行代碼載入angular.js腳本，當瀏覽器將整個HTML頁面載入完畢後將會執行該angular.js腳本，angular.js腳本運行後將會尋找含有ng-app指令的HTML標籤，該標籤即定義了AngularJS應用的做用域。
雙大括號綁定的表達式：
<p>Nothing here {{'yet' + '!'}}</p>
這行代碼演示了AngularJS模板的核心功能——綁定，這個綁定由雙大括號{{}}和表達式'yet' + '!'組成。
這個綁定告訴AngularJS須要運算其中的表達式並將結果插入DOM中，接下來的步驟咱們將看到，DOM能夠隨着表達式運算結果的改變而實時更新。
AngularJS表達式Angular expression是一種相似於JavaScript的代碼片斷，AngularJS表達式僅在AngularJS的做用域中運行，而不是在整個DOM中運行。
源碼：http://files.cnblogs.com/files/xiaowei0705/Web_Demo_001.rar
- 1. Angular入門篇----AngularJs和angular的對比
- 2. AngularJs入門
- 3. AngularJS入門demo
- 4. AngularJS入門
- 5. angularjs入門
- 6. AngularJS入門（三）
- 7. AngularJS入門（一）
- 8. AngularJS入門（五）
- 9. (angularjs) 入門
- 10. AngularJS入門(一)
- 更多相關文章...
- • Memcached入門教程 - NoSQL教程
- • Neo4j數據庫入門教程 - NoSQL教程
- • YAML 入門教程
- • Java Agent入門實戰（一）-Instrumentation介紹與使用
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. Angular入門篇----AngularJs和angular的對比
- 2. AngularJs入門
- 3. AngularJS入門demo
- 4. AngularJS入門
- 5. angularjs入門
- 6. AngularJS入門（三）
- 7. AngularJS入門（一）
- 8. AngularJS入門（五）
- 9. (angularjs) 入門
- 10. AngularJS入門(一)