1.背景介紹

在平時的編碼中，我們總會想著有什麼方法能夠簡化我們的工作流程，讓我們只專心於業務邏輯和資料的處理，而angularjs就為我們程式設計師實現了這一點。$scope $rootScope $watch 和 $state就是裡面的幾個方法，今天著重跟大家討論一下這幾個方法

2.知識剖析

$scope $scope在angularjs中，你可以把它理解成作用域，每個不同的controller，都具有它不同的作用域，所以

controller不同，他們的scope是不同的，那麼，如果我們想象js那樣，做一個全域性變數該怎麼辦呢？這就要說

到rootScope了。

$rootScope $rootScope是由angularJS載入模組的時候自動建立的，每個模組只會有1個rootScope;

$rootScope就相當於一個全域性作用域，所以我們儲存在其中的東西是全域性性的，在任一controller之中都能夠使用

scope是html和單個controller之間的橋樑，資料繫結就靠他了。rootscope是各個controller中scope的橋樑。

用rootscope定義的值，可以在各個controller中使用。

$watch 相信使用過angularjs的同學都知道，ng中有個比較重要的特點，叫做雙向繫結，那麼這個雙向繫結是如何實現的呢？

當我們在創建出scope下的一個新屬性的時候，ng就會主動為我們新屬性加上$watch這個方法，這個方法會監聽我們

的資料變化，當資料變化之後，就立即把view和scope上資料同步。

雖然angular會為每一個ng-model新增一個$watch事件，但我們還可以定義自己的$watch，所以需要了解一下$watch的用法；

$watch(watchExpression, listener, objectEquality);

watchExpression:監聽的物件，它可以是一個angular表示式如’name’,或函式如function();注意如果是函式的話，需要加上（）不能只寫函式名；

listener:當watchExpression變化時會被呼叫的函式或者表示式,它接收3個引數：newValue(新值), oldValue(舊值), scope(作用域的引用)

objectEquality,是否深度監聽，如果設定為true,它告訴Angular檢查所監控的物件中每一個屬性的變化. 如果你希望監控陣列的個別元素或者物件的屬性而不是一個普通的值, 那麼你應該使用它

$state $state是路由中的一項服務,簡單來說就是給路由一個對應的狀態，讓其根據不同的狀態載入不同的頁面；

路由的具體用法

$stateParams $stateParams是一個物件，包含 url 中每個引數的鍵/值。$stateParams可以為控制器或者服務提供 url 的各個部分。

注意：$stateParams必須與一個控制器相關，並且$stateParams中的“鍵/值”也必須事先在那個控制器的url屬性中有定義。

3.常見問題

如何通過$rootscope傳參

4.解決方案

app.controller('AController', function ($scope, $rootScope) {
$rootScope.varX = "XXX";
});
app.controller('BController', function ($scope, $rootScope) {
console.log("$rootScope.varX:", $rootScope.varX);
});

5.編碼實戰

demo1

6.擴充套件思考

怎麼取消$watch，為什麼取消？

$watch的效能消耗較大，所以對於已經不需要監視的watch，記得定時取消掉。

7.參考文獻

     <p>http://yuankeqiang.lofter.com/post/8de51_1454f93</p>
        <p>https://blog.csdn.net/u010451286/article/details/50635839</p>

8.更多討論

1.$rootScope是否可以替代$scope？ 可以，但是不建議這樣用，相當於js中的全域性變數，定義過多會導致全域性汙染；

2.陣列深拷貝當中的slice()的用法： slice()能夠基於當前陣列中的一個或則多個項建立一個新陣列；

該方法可以接收1-2個引數，在只有一個引數的情況下，該方法返回引用陣列的所有項，兩個引數的情況下，該方法返回起始和結束位置之間的（但是不包括結束項）所有項；

3.$stateParams如果沒有用url接收會怎樣？ 如果沒有在url裡面接收，會導致再次提取$stateParams中的資料的時候，會找不到該資料；$stateParams物件中根本就沒有該屬性；