一、AngularJs簡(jiǎn)介
? ? ? 1.AngularJS使用了不同的方法，它嘗試去補(bǔ)足HTML本身在構(gòu)建應(yīng)用方面的缺陷。AngularJS通過使用我們稱為標(biāo)識(shí)符(directives)的結(jié)構(gòu)，讓瀏覽器能夠識(shí)別新的語(yǔ)法。
? ? ?2. 最為核心的特性：MVVM、模塊化、自動(dòng)化雙向數(shù)據(jù)綁定、語(yǔ)義化標(biāo)簽、依賴注入等等。AngularJS直接用網(wǎng)頁(yè)本身作為模板。
二、AngularJs的指令
ng-app指令標(biāo)記了AngularJS腳本的作用域，在中添加ng-app屬性即說明整個(gè)都是AngularJS腳本作用域?？梢灾苯邮褂茫部梢灾付ㄒ粋€(gè)名字。
ng-controller = "str"指定一個(gè)AngularJs的控制器，相當(dāng)于ng-app模塊下的組件，其最大的作用就是把一個(gè)作用域（$scope）和模版上的html標(biāo)簽綁定到一起，限定了$scope的作用域
ng-model=””獲取和修改具有value屬性的值，數(shù)據(jù)的雙向綁定
ng-bind=””修改一個(gè)標(biāo)簽內(nèi)部的innerHTML，設(shè)置的值不存在該標(biāo)簽元素不會(huì)顯示，數(shù)據(jù)不是雙向的
{{ }}插值語(yǔ)法是渲染數(shù)據(jù)到頁(yè)面中。插值符號(hào)｛｛｝｝不能替換屬性的名字，能夠替換的是文本內(nèi)容和屬性的值。
ng-click=”fun” AngularJs自帶的單擊事件
ng-dblclick=”fun” AngularJs自帶的雙擊事件
ng-focus=”fun” ? AngularJs自帶的獲取焦點(diǎn)事件
ng-blur=”fun” ?AngularJs自帶的失去焦點(diǎn)事件
ng-change=”fun” AngularJs自帶的事件
ng-submit=”fun”?AngularJs自帶的表單提交事件
……
ng-class=”{類樣式1:true,類樣式2:false}”AngularJs設(shè)置狀態(tài)樣式
ng-style=”{屬性1:值,屬性2:值}”AngularJs設(shè)置狀態(tài)樣式
ng-readonly=”boolean” ?AngularJs設(shè)置只讀狀態(tài)，可以提交數(shù)據(jù)
ng-disable=”boolean” ?AngularJs設(shè)置未激活狀態(tài)，不可提交數(shù)據(jù)
ng-hide=”boolean” ?AngularJs設(shè)置隱藏狀態(tài)，不改變dom結(jié)構(gòu)
ng-show=”boolean” AngularJs設(shè)置顯示狀態(tài)，不改變dom結(jié)構(gòu)
ng-if=”boolean” ?AngularJs設(shè)置if判斷流程，改變dom結(jié)構(gòu)，true顯示該dom，false隱藏該dom元素
ng-switch=”值”AngularJs設(shè)置分支判斷流程，會(huì)改變dom結(jié)構(gòu)
ng-switch-when=”判斷值”顯示對(duì)應(yīng)值的dom
ng-switch-default默認(rèn)的值
ng-repeat ? AngularJs循環(huán)流程，可以循環(huán)數(shù)組和對(duì)象，并且會(huì)重新限定一個(gè)作用域，在該作用域下有一個(gè)對(duì)象（包含了各種信息）。
ng-view ? 實(shí)現(xiàn)路由的托管，根據(jù)路徑的不同，將對(duì)應(yīng)的頁(yè)面渲染到網(wǎng)頁(yè)，即ng-view所在的位置
三、AngularJs使用
2、使用一個(gè)AngularJsBatarang瀏覽器插件可以輔助開發(fā)
3、在script標(biāo)簽中
var app = angular.module('demo', []);
參數(shù)一：模塊的名字
參數(shù)二：要依賴的其它模塊名字
作用：創(chuàng)建了一個(gè)angularJs模塊
app.controller('tian', function ($http, $scope) {
$scope.name = '綁定值';
$scope.click = function () {
$scope.name = '綁定方法，在方法內(nèi)部再綁定值'
};
$http.get('lisi.json')
.success(function (data) {
console.log(data);
})
});
參數(shù)一：控制器的名字
參數(shù)二：帶$scope、$http、$parse、$rootScope等固定形參（沒有順序）的函數(shù)
作用：創(chuàng)建一個(gè)控制器并限定函數(shù)的作用域
四、AngularJs中的依賴注入
在回調(diào)函數(shù)中，AngularJs會(huì)提供對(duì)應(yīng)參數(shù)的對(duì)象服務(wù)，用什么功能就傳什么參數(shù)。
$scope控制器的作用域，是一個(gè)對(duì)象可以在內(nèi)部綁定任意屬性
$scope.$watch（“表達(dá)式”，function(newvalue,oldvalue,scope){}） 是$scope上自帶的一個(gè)方法，用來監(jiān)聽表達(dá)式值的變化
$http是angularJs對(duì)ajax的封裝
$parse作用：將一個(gè)AngularJS表達(dá)式轉(zhuǎn)換成一個(gè)函數(shù)
$rootScope可以訪問控制器的根（父級(jí)）作用域
$timeout是AngularJs對(duì)原生timeout的封裝
$location是AngularJs對(duì)window原生location的封裝
$location. path( )是$location對(duì)象的一個(gè)屬性，可以獲取路由路徑
五、AngularJs中的雙向數(shù)據(jù)綁定
? ? ? ?雙 向綁定：把我們的數(shù)據(jù)和html文檔綁定起來，我們只需要關(guān)注數(shù)據(jù)就可以了，dom操作由angularjs去管理，一來方便，二可以提高安全性（程序員寫代碼的bug概率降低）
在angular中MVVM模式主要分為四部分：
1.View：它專注于界面的顯示和渲染，在angular中則是包含一堆聲明式Directive的視圖模板。
2.ViewModel：它是View和Model的粘合體，負(fù)責(zé)View和Model的交互和協(xié)作，它負(fù)責(zé)給View提供顯示的數(shù)據(jù)，以及提供了View中Command事件操作Model的途徑；在angular中$scope對(duì)象充當(dāng)了這個(gè)ViewModel的角色；
3.Model：它是與應(yīng)用程序的業(yè)務(wù)邏輯相關(guān)的數(shù)據(jù)的封裝載體，它是業(yè)務(wù)領(lǐng)域的對(duì)象，Model并不關(guān)心會(huì)被如何顯示或操作，所以模型也不會(huì)包含任何界面顯示相關(guān)的邏輯。在web頁(yè)面中，大部分Model都是來自Ajax的服務(wù)端返回?cái)?shù)據(jù)或者是全局的配置對(duì)象；而angular中的service則是封裝和處理這些與Model相關(guān)的業(yè)務(wù)邏輯的場(chǎng)所，這類的業(yè)務(wù)服務(wù)是可以被多個(gè)Controller或者其他service復(fù)用的領(lǐng)域服務(wù)。
4.Controller：這并不是MVVM模式的核心元素，但它負(fù)責(zé)ViewModel對(duì)象的初始化，它將組合一個(gè)或者多個(gè)service來獲取業(yè)務(wù)領(lǐng)域Model放在ViewModel對(duì)象上，使得應(yīng)用界面在啟動(dòng)加載的時(shí)候達(dá)到一種可用的狀態(tài)。
View不能直接與Model交互，而是通過$scope這個(gè)ViewModel來實(shí)現(xiàn)與Model的交互。對(duì)于界面表單的交互，通過ngModel指令來實(shí)現(xiàn)View和ViewModel的同步。ngModelController包含$parsers和$formatters兩個(gè)轉(zhuǎn)換器管道，它們分別實(shí)現(xiàn)View表單輸入值到Model數(shù)據(jù)類型轉(zhuǎn)換和Model數(shù)據(jù)到View表單數(shù)據(jù)的格式化。對(duì)于用戶界面的交互Command事件（如ngClick、ngChange等）則會(huì)轉(zhuǎn)發(fā)到ViewModel對(duì)象上，通過ViewModel來實(shí)現(xiàn)對(duì)于Model的改變。然而對(duì)于Model的任何改變，也會(huì)反應(yīng)在ViewModel之上，并且會(huì)通過$scope的“臟檢查機(jī)制”（$digest）來更新到View。從而實(shí)現(xiàn)View和Model的分離，達(dá)到對(duì)前端邏輯MVVM的分層架構(gòu)。
七、什么是單頁(yè)面應(yīng)用
本質(zhì)：無刷新的單頁(yè)面，當(dāng)用戶操作的時(shí)候ajax請(qǐng)求數(shù)據(jù)，局部的更新我們的頁(yè)面，所有的操作都在這張頁(yè)面上完成，都由JavaScript來控制。
理念：更好的用戶體驗(yàn)，無停頓的用戶交互
問題：寫起來非常的麻煩
