一、Angular特點：

1、雙向數據綁定，主打賣點

2、MVVM 模型，把視圖和邏輯分開

3、依賴註入

個人感覺，在Angular中，視圖對應 HTML 模板，視圖邏輯對應directive 和 controller。

二、模塊

Angular 中通過模塊來管理命名空間，可以通過不同的模塊來隔離不同頁面的邏輯。所雖然它稱作 “module”，但其實更像是一個命名空間，或者叫一個包。

通過 angular.module(“name”, [/依賴/]) 來聲明一個模塊。Angular中的模塊聲明周期分兩步，一個是配置階段，一個是運行階段。

angular.module(“app-name”, [])

.config(function() { //配置階段，先執行

})

.run(function() { //運行階段，後執行

});

一般我們給按頁面劃分模塊，也可以把整個應用都聲明成一個模塊，然後通過模塊來啟動整個頁面的邏輯。

可以把run當做main函數，如果有一些在應用啟動時需要執行的代碼，比如判斷當前有沒有登錄，可以放在run函數中。

三、雙向數據綁定

雙向數據綁定是 Angular 的主打特色。一般我的數據都是單向綁定的，也就是當JS中的變數發生變化的時候更新到DOM，但是大部分時候並不會在DOM中的值變化的時候去自動更新JS中的變數。

看一個雙向綁定的例子：

 <input ng-model=“user.name" type="text" placeholder="Your name">

 <h1>Hello {{ user.name }}</h1>

這樣就實現了一個雙向綁定，當在input中輸入值的時候，h1中的值會立刻發生變化。

因為JS傳值的問題，建議綁定的時候總是通過對象屬性而不是通過直接傳值的方式來做。

四、控制器（controller）

在 Angular 中，控制器的作用就是創建新的作用域，Angular創建一個控制器的時候都會為其創建一個$scope，這個$scope就是一個新的作用域。當然你可以聲明這個作用域和父作用域的關係，到底是隔離還是繼承。

在angular中這樣聲明一個控制器：

 app.module(“home”, [])

      .controller(“MyController”, function($scope) {

           $scope.name = “Mr Lee”;

      });

在HTML中這樣使用

 <div MyController>{{name}}</div>

 <!— 或者這樣 —>

 <MyController>{{name}}</div>

 <!— 還有通過class或者註釋等方式都可以使用 —>

Angular 是一個 MVVM 模型，即 Model - View - ViewModel，其中的 ViewModel 是視圖對應的Model，在Angular中就是 $scope。因此 $scope的作用就是存放與對應視圖相關的數據。比如上例中我們就是存儲了一個名字，如果是一個個人名片，我們存儲的就是這個人的基本信息。

在 Angular 中 , 存在一個$rootScope，所有的其他$scope形成了一顆以$rootScope為根節點的樹。每一個 $scope 都負責對應視圖的數據存儲，業務邏輯等。

在一個 controller 的作用域範圍內，可以直接使用 $scope 上的屬性，比如你的$scope是這樣聲明的：

 $scope = { name: “Lily”, sayName: function(){alert($scope.name{});

那麼你在HTML中可以這麼使用 scope

 <h2>name: {{name}}</h2>

 <button ng-click=“sayName()”>say name</button>