AngularJs 功能（四）--控制器

控制器

控制器Controller是Angular應用三大組成部分之一。

說一說我對angular控制器的理解：
AngularJS 應用程序被控制器控制。
ng-controller 指令定義了應用程序控制器。
控制器是 JavaScript 對象，由標準的 JavaScript 對象的構造函數 建立。
AngularJS 使用$scope 對象來調用控制器。
在 AngularJS 中， $scope 是一個應用象(屬於應用變量和函數)。
控制器的 $scope （至關於做用域、控制範圍）用來保存AngularJS Model(模型)的對象。

要明確建立一個$scope 對象，咱們就要給DOM元素安上一個controller對象，使用的是ng-controller 指令屬性：

<div ng-controller="MyController"> {{ person.name }} </div>

ng-controller指令給所在的DOM元素建立了一個新的$scope 對象，並將這個$scope 對象包含進外層DOM元素的$scope 對象裏。在上面的例子裏，這個外層DOM元素的$scope 對象，就是$rootScope 對象。

scope對象初始化
一般狀況下，你建立一個angular應用時，你須要先設置scope的初始狀態。你須要爲scope設置一些屬性，包含在view中預先聲明的model，全部$scope的屬性在controller註冊的DOM裏都是可用的。

給scope對象增長一些行爲
爲了響應一些事件或者在view中進行一些計算，咱們必須爲$scope增長一些行爲。咱們經過爲$scope對象增長方法的方式爲他增長行爲，這些方法能夠被template/view調用。

下面的示例演示如何爲controller增長方法

angular.module('myApp'[]).controller('DoubleController', ['$scope', function($scope) {
  $scope.double = function(value) { return value * 2; };
}]);

controller一旦被添加到DOM中，該方法就能夠在template中被調用

<div ng-controller="DoubleController">
  Two times <input ng-model="num"> equals {{ double(num) }}
</div>

要注意如下幾點：

ng-controller directive 隱式地爲template建立了一個scope，這個scope又被SpicyController controller管理。
僅僅是一個簡單的javascript函數。命名規範是大寫字母開頭，以Controller結束。
爲scope分配一個屬性去建立和更新model
controller的方法能夠經過直接賦值的方式建立
controller的方法或者屬性在template中是可用的

全部scope都遵循原型繼承（prototypal inheritance），這意味着它們都能訪問父scope們。對任何屬性和方法，若是AngularJS在當前scope上找不到，就會到父 scope上去找，若是在父scope上也沒找到，就會繼續向上回溯，一直到$rootScope 上。

惟一的例外：有些指令屬性能夠選擇性地建立一個獨立的scope，讓這個scope不繼承它的父scope們，這個會在指令詳解中說明。