MVVM簡介
針對客戶端應用開發AngularJS吸收了傳統的MVC基本原則。MVC(Model-View-Controll)設計模式針對不同的人可能意味不同的東西 ,AngularJS並不執行傳統意義上的MVC，更接近於MVVM。
MVVM模式是Model-View-ViewMode模式的簡稱。由視圖(View)、視圖模型(ViewModel)、模型(Model)三部分組成，通過這三部分實現UI邏輯、呈現邏輯和狀態控制、數據與業務邏輯的分離。
Model將和ViewModel互動(通過$scope對象)，將監聽Model的變化。這些可以通過View來發送和渲染，由HTML來展示你的 代碼。View可以通過$routeProvider對象來支配，所以你可以深度的鏈接和組織你的View和Controller，將他們變成導航 URL。AngualrJS同時提供了無狀態的Controller，可以用來初始化和控制$scope對象。
Model與MVC模式一樣，Model用於封裝與應用程序的業務邏輯相關的數據以及對數據的處理方法。它具有對數據直接訪問的權利，例如對數據庫的訪問，Model不依賴於View和ViewModel，也就是說，模型不關心會被如何顯示或是如何被操作，模型也不能包含任何用戶使用的與界面相關的邏輯。
ViewModel是一個用來提供特別數據和方法從而維護指定view的對象,。ViewModel是$scope的對象，只存在於AnguarJS的應用中。$scope只是一個簡單的js對象，這個對象使用簡單的API來偵測和廣播狀態變化。
Controller負責設置初始狀態和參數化$scope方法用以控制行爲。需要指出的controller並不保存狀態也不和遠程服務互動。
View是AngularJS解析後渲染和綁定後生成的HTML。這個部分幫助你創建web應用的架構。$scope擁有一個針對數據的參考，controller定義行爲，view處理佈局和互動。
使用MVVM模式有幾大好處：
1. 低耦合：View可以獨立於Model變化和修改，一個ViewModel可以綁定到不同的View上，當View變化的時候Model可以不變，當Model變化的時候View也可以不變。
可重用性：可以把一些視圖的邏輯放在ViewModel裏面，讓很多View重用這段視圖邏輯。
獨立開發：開發人員可以專注與業務邏輯和數據的開發(ViewModel)。設計人員可以專注於界面(View)的設計。
可測試性：可以針對ViewModel來對界面(View)進行測試。
##**控制器** AngularJS控制器控制AngularJS應用程序的數據，是常規的JavaScript對象。 ng-controller指令就是用來定義應用程序控制器的，並且同時創建了一個新的作用域關聯到相應的DOM元素上。 所謂作用域就是一個指向應用模型的對象，它是表達式的執行環境，作用域有層次結構，這個層次和相應的DOM幾乎是一樣的，作用域能監控表達式和傳遞事件並且可以從父作用域繼承屬性。 每一個AngularJS應用都有一個絕對的根作用域。但也可能有多個子作用域。 一個應用可以有多個作用域，因爲有一些指令會生成新的子作用域，當新作用域被創建的時候，他們會被當成子作用域添加到父作用域下，這使得作用域會變成一個和相應DOM結構一個的樹狀結構。控制器
現在我們就用ng-controller指令來創建一個簡單的控制器定義，如下所示：
<div ng-app="" ng-controller="MyController">
請輸入一個名字：<input type="text" ng-model="person.name">
Hello <span ng-bind="person.name"></span>
</div>
<script>
function MyController($scope) {
$scope.person = {
name: "World"
};
}
如上所述，我們通過ng-controller指令創建了一個JavaScript對象 —— MyController並帶有name屬性，那參數$scope是什麼呢，代表什麼意思呢。
現在我們就來解答MyController對象參數 —— $scope。
$scope就是把一個DOM元素連結到控制器上的對象，它提供一個綁定到DOM元素(以及其子元素)上的執行上下文。它也是一個JavaScript對象，指向應用程序作用域內的所有HTML元素和執行上下文。作用域呢，就是作爲$scope的數據屬性關聯到DOM上的，並且能在需要調試的時候被獲取到。
要明確創建一個$scope對象，我們就要給DOM元素安上一個controller對象，使用的是ng-controller 指令屬性。
所有$scope都遵循原型繼承，這意味着它們都能訪問父$scope們,對任何屬性和方法，如果AngularJS在當前$scope上找不到，就會到父$scope上去找，如果在父$scope上也沒找到，就會繼續向上回溯，一直到$rootScope上，這個$rootScope是最頂級的$scope，它對應着含有 ng-app指令屬性的那個DOM元素，也就是說根作用域關聯的DOM就是ng-app指令定義的地方。
也就是說，擁有了$scope，我們就可以操作作用域內任何我們想要獲取的對象數據。
控制器不僅聲明屬性也可以聲明方法，如下所示：
<div ng-app="" ng-controller="MyController">
Your name:
<input type="text" ng-model="username">
<button ng-click="sayHello()">打招呼</button>
<hr />
{{greeting}}
</div>
<script>
function MyController($scope) {
$scope.username = 'World';
$scope.sayHello = function() {
$scope.greeting= 'Hello ' + $scope.username + '!';
};
}
</script>
參考以上代碼，趕快動手試試控制器的使用方法吧！
當然如果是開發條件的需要，我們也可以將控制器寫在外部文件中，那如上示例該怎麼做呢，很簡單，如下簡單引用即可：
<script src="MyController.js"></script>