1.背景介紹
在平時的編碼中,我們總會想著有什么方法能夠簡化我們的工作流程,讓我們只專心于業務邏輯和數據的處理,而angularjs 就為我們程序員實現了這一點。$scope $rootScope $watch 和 $state就是里面的幾個方法,今天著重跟大家討論一下這 幾個方法
2.知識剖析
$scope
$scope在angularjs中,你可以把它理解成作用域,每個不同的controller,都具有它不同的作用域,所以 controller不同,他們的scope是不同的,那么,如果我們想象js那樣,做一個全局變量該怎么辦呢?這就要說 到rootScope了。
$rootScope
$rootScope就相當于一個全局變量,所以我們保存在其中的東西是全局性的,在任一controller之中都能夠使用
scope是html和單個controller之間的橋梁,數據綁定就靠他了。rootscope是各個controller中scope的橋梁。 用rootscope定義的值,可以在各個controller中使用。
$watch
相信使用過angularjs的同學都知道,ng中有個比較重要的特點,叫做雙向綁定,那么這個雙向綁定是如何實現的呢? 當我們在創建出scope下的一個新屬性的時候,ng就會主動為我們新屬性加上$watch這個方法,這個方法會監聽我們 的數據變化,當數據變化之后,就立即把view和scope上數據同步。
$watch(watchExpression, listener, objectEquality);
watchExpression,需要監控的表達式
listener,處理函數,函數參數如下 function(newValue,oldValue, scope)
objectEquality,是否深度監聽,如果設置為true,它告訴Angular檢查所監控的對象中每一個屬性的變化. 如果你希望監控數組的個別元素或者對象的屬性而不是一個普通的值, 那么你應該使用它
$state
在ajax技術發展普及之后,因為其不會留下歷史記錄方便瀏覽器訪問和對于seo不友好的特點,一個新技術應運而生: 路由,$state就是路由中的一項服務。
3.常見問題
如何讓相同的指令,具有不同的作用域
4.解決方案
只需要在指令中加上scope:{},就能把它的作用域獨立出來啦!每用一次指令都會有一個不同的作用域喲。
{ }:創建一個新的“隔離”scope,但仍可與父scope通信 隔離的scope,通常用于創建可復用的指令,也就是它不用管父scope中的model。然而雖然說是“隔離”,但通常我們還是需要讓這個子scope跟父scope中的變量進行綁定。綁定的策略有3種:
@:單向綁定,外部scope能夠影響內部scope,但反過來不成立
=:雙向綁定,外部scope和內部scope的model能夠相互改變
&:把內部scope的函數的返回值和外部scope的任何屬性綁定起來