以前在學習angularjs的時候學習到$scope和$rootscope的時候,看了一下用法就感覺這個作用域不就和原生的區域性、全域性作用域是差不多的,然後就沒有細看,這段時間真正用到作用域方面的時候發現還是有區別的。
首先$scope是需要注入到控制器中的,作用域也就是當前控制器的範圍內適用;如果沒有尋找到則會沿著作用域鏈向上搜尋,直到根作用域$rootscope。scope是html和單個controller之間的橋梁,資料繫結就靠他了。rootscope是各個controller中scope的橋梁。用rootscope定義的值,可以在各個controller中使用。
而且,$rootscope是由angularjs載入模組的時候自動建立的,每個模組只會有1個rootscope。rootscope建立好會以服務的形式加入到 $injector中。也就是說通過 $injector.get("$ rootscope ");能夠獲取到某個模組的根作用域。更準確的來說,$rootscope是由angularjs的核心模組ng建立的。
例子一:
console.log(has_rootscope1.has("$rootscope")); //true
console.log(has_rootscope1.has("$rootscope")); //false
var has_rootscope3 = angular.injector(['ng']);
console.log(has_rootscope1.has("$rootscope")); //true
上例說明:
$tootscope由核心模組ng建立,並以服務的形式存在於injector中。如果建立injector的時候,指定了ng模組,那麼該injector中就包含$toorscope服務;否則不包含。
例子二:
//控制器裡的$injector,是有angular框架自動建立的
module.controller('ctrl',function($scope,$injector,$rootscope));
var rootscope = myinjector.get('$rootscope');
console.log($rootscope.name); //undefined
上例說明:angular.injector()可以呼叫多次,每次都返回新的injector物件。所以我們自己建立的injector物件和angular框架自動建立的$injector不是同乙個物件,那麼得到的$rootscope也就不是同乙個;由此可見,$rootscope的作用域不是我們想象中的全域性作用域。
例子三:
.controller('ctrl',function($scope,$injector,$rootscope));
上例說明:
ng-controller指令給所在的dom元素建立了乙個新的$scope物件,並作為$rootscope的子作用域;$scope是由$rootscope建立的,$scope不會保護在$injector中。
例子四:
//分別記住變數,用來判斷跨控制器是否相等
var my_rootscope = null;
var my_scope = null;
var my_injector = null;
module.controller('ctrl1',function($scope,$rootscope,$injector));
module.controller('ctrl2',function($scope,$rootscope,$injector));
上例說明:
弄清了這三者的關係,我們看下angular提供的兩個api,乙個是scope(),乙個是injector();使用angular.element()返回的dom物件,都會包含這兩個方法,用來獲取與之關聯的scope()和injector();
由於每個模組的injector是唯一的,所以angular.elment().injector()直接返回元素所在模組的injector;
angular.element().scope()可以獲取到當前的scope或父scope;如果當前元素有scope,則返回自己的scope;如果沒有則向父級方向尋找。如果找不到則返回rootscope;即返回作用域鏈上,距離該元素最近的scope。
對AngularJs的學習
angualrjs有什麼好處?angularjs是為了克服html在構建應用上的不足而設計的。angularjs使用了不同的方法,它嘗試去補足html本身在構建應用方面的缺陷。angularjs通過使用我們稱為識別符號 directives 的結構,讓瀏覽器能夠識別新的語法。例如 1.使用雙大括號 ...
angularjs學習筆記
不要用控制器去繼承控制器,通用的通過service來通用 不要試圖服用controller,乙個控制器只負責乙個塊試圖 不要在controller中操作dom,這不是controller的職責,用指令只做 不要在controller中做資料初始化,ng有表單控制項 不要在controller中做資料...
angularjs 學習筆記
文件 function angular bootstrap element,modules config 第乙個引數,要繫結的元素,第二個引數要繫結的modules 第三個引數 暫不明確 controller welcomecontroller function scope angular.boot...