这里讲的是一些scope的操做,如建立/注销/各类监听及scope间的通讯等等。express
$rootScope.Scopeapi
可使用$injector经过$rootScope关键字检索的一个根做用域。数组
能够经过$new()方法建立子做用域。(大多子做用域是在HTML模板被执行编译时自动生成)浏览器
格式:$rootScope.Scope([Providers],[instanceCache])app
[Providers]:当前做用域须要被提供的服务工厂地图。默认是ng。框架
[instanceCache]:为须要providers追加/重写的服务提供预实例化服务。异步
方法:ide
$new(isolate);函数
建立一个新的子做用域。post
父做用域将会广播$digest()和$digest()事件。做用域可使用使用$destroy()从做用域的层级结构中移除。
$destroy()使其所需的范围和它的子做用域范围内永久地从父做用域分离从而中止参与模型变化检测和侦听通知调用。
isolate:boolean类型。若是值是true,那么这个scope不会从父scope继承原型。做用域是独立的,在这里不能看见父scope的属性。
当写小窗户组件的时候,这将是很实用的去防止不当心读取到其父级的状态。
$watch(watchExpression,[listener],[objectEquality]);
注册一个监听器的回调函数,该函数在watchExpression变化的时候被执行。
watchExpressions表达式每次执行都会产生一次$digest(),而且返回一个将会被监听的值。($digest()发现watchExpressions发生变化而执行屡次,而且每次都是幂等的)
监听只有在当前的watchExpressions与以前的值不想等是被调用。变更是根据angular.equals函数判断的。须要保存对象比较后的值,也须要用到angular.copy。这也意味着看复杂的选项将不利于记忆和性能影响。
监听可能会改变模型,这可能会引起其余监听的变化。Ng会一直执行直到监听的值稳点。重播迭代极限是10,为了防止陷入无限循环的死锁。
watchExpressions:string或者function类型。每一个$digest循环周期的表达式,返回值的变化会触发调用监听。
listener: watchexpression的返回值改变时发生回调。
objectEquality:使用angular.equals代替引用相等性比较对象相等比较 (深度监听)。
$watchGroup(watchExpressions,listener);
针对watchexpressions数组变量的$watch()。集合里的任何一个表达式变化都将引起监听的执行。
watchExpressions数组里的每一项都被标准的$watch()操做观察,而且审查每一次的$digest()去观察每一项是否变化。
当watchExpressions数组里的任何一项发生变化即执行。
$watchCollection(obj,listener);
浅度的观察对象属性,而且在其变化时执行(对于数组,这意味着看数组项;对于对象,这意味着看属性)。若是检测到更改,则该侦听器将被触发。
$digest();
处理全部的当前做用域和它的子做用域的监听。由于监听可能改变模型,因此$digest()会一直执行知道模型稳定。这意味这他可能进入无限循环。若是迭代次数超过10,这个函数将抛出“Maximum iteration limit exceeded”错误。
$destroy();
从父域中删除当前的scope(及其全部的子scope)。删除意味着$digest()再也不传播到目前做用域及其子做用域。删除也意味着目前的做用域符合垃圾集合的条件。
$eval([expression],[locals]);
在当前做用域上执行表达式并返回结果。表达式的任何异常将传播(捕获)。在求Angular表达式的值的时候有用。
$evalAsync([expression]);
在稍后的时间点上执行当前范围的表达式(异步)。
$apply([exp]);
$apply() 用来在Angular框架外执行angular内部的表达式。(例如浏览器的DOM事件,setTimeout,XHR或第三方库)。
$on(name,listener);
监听一个给定类型的事件。
name:监听的事件名。
listener:当事件发生时调用的函数。
$emit(name,args);
向上级已注册的做用域传播指定的事件,直到根做用域。
name:发出的事件名称。
args:一个或多个可选参数,将传递到事件侦听器。
$broadcast(name,args);
向下级已注册的做用域广播指定的事件。
name:发出的事件名称。
args:一个或多个可选参数,将传递到事件侦听器。
$new,$destroy,$watch使用代码:
<div ng-app="Demo"> <div ng-controller="testCtrl as ctrl"> <input ng-model="ctrl.text.words" /> <input ng-list="," ng-model="ctrl.list" /> </div> </div>
(function () { angular.module("Demo", []) .run(["$rootScope",rootScope]) .controller("testCtrl",["$scope",testCtrl]) function rootScope($rootScope){ var rootScope = $rootScope; var _scope = rootScope.$new(); _scope.value = "Hello World"; _scope.$destroy();//$$destroyed:true }; function testCtrl($scope){ var vm = this; vm.text = { words:"Hello World",id:1}; $scope.$watch("ctrl.text",function(n,o){ console.log(n,o); // n 新值 o 旧值 },true); vm.list = ["a","b","c","d"]; $scope.$watchCollection("ctrl.list",function(n,o){ console.log(n,o); // n 新值 o 旧值 }); }; }());
$on,$emit,$broadcast使用代码:
<div ng-app="Demo"> <div ng-controller="testCtrl as ctrl"> {{ctrl.number||'Here where receive a number from childScope'}} <div ng-controller="childCtrlOne as childOne"> <input type="button" ng-click="childOne.toFatherScope()" value="click me" /> </div> <div ng-controller="childCtrlTwo as childTwo"> {{childTwo.number||'Here where receive a number from fatherScope'}} </div> </div> </div>
(function () { angular.module("Demo", []) .controller("testCtrl",["$scope",testCtrl]) .controller("childCtrlOne",["$scope",childCtrlOne]) .controller("childCtrlTwo",["$scope",childCtrlTwo]) function testCtrl($scope){ var vm = this; $scope.$on("toFather",function(e,v){ vm.number = v; $scope.$broadcast("toChild",v); }) }; function childCtrlOne($scope){ var vm = this; var count = 0; vm.toFatherScope = function(){ count += 1; $scope.$emit("toFather",count); } } function childCtrlTwo($scope){ var vm = this; $scope.$on("toChild",function(e,v){ vm.number = v; }) } }());
大体就学习归总出来这些,果真本身去api 翻成中文理解一遍,再写代码运行一遍,会对这些函数的意思和用法了解的多。简单的说下对scope的理解,就跟树结构同样,从rootScope做为 根节点开始扩散,有父子关系的,有兄弟关系的,并且带有继承,子scope继承父scope上的属性...