博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
$rootScope
阅读量:6678 次
发布时间:2019-06-25

本文共 3161 字,大约阅读时间需要 10 分钟。

参考地址 https://docs.angularjs.org/api/ng/type/$rootScope.Scope

angular 的scope一般上都是有继承关系的,也就是说可以通过原型访问到父亲属性. 

原型可以参考 http://www.cnblogs.com/keatkeat/p/3896758.html

$rootScope 提过了一些方法, 当然子scope也都继承了这些方法

 

$rootScope.new(isolate

isolate 是 boolean ,中文翻译是隔离 。 也就是说创建一个$scope但是不要继承父亲

这个我们在写指令的时候通常会使用上。

 

$watch(watchExpression, listener, [objectEquality], [deregisterNotifier])

watch 就是属性监听。第一个参数是要监听的属性名字,参数2是回调事件 

一般上我们都是监听$scope上的属性,但是如果你想监听一个普通的变量,可以这么写 $scope.$watch(function(){ retrun some var },listener)

var scope = $rootScope;           scope.name = 'misko';           scope.counter = 0;           expect(scope.counter).toEqual(0);           scope.$watch('name', function(newValue, oldValue) {
if(newValue === oldValue) { //do init } scope.counter = scope.counter + 1; }); expect(scope.counter).toEqual(0); scope.name = 'alibaba' //在还没有digest前,修改关注的值是没有意义的! scope.$digest(); // the listener is always called during the first $digest loop after it was registered expect(scope.counter).toEqual(1);

注意红色的字,监听之后的第一个digest一定会触发一次监听回调,我们可以在回调中判断来做一下初始化,只有第一次会这样,接下来只有当数据changed才会触发回调。

在还没有digest的情况下不要去修改你关注的值,那是没有效果的 ,它就好比你把这个改变值的代码写在还没有watch之前,angular的watch要配合digest才管用,这个一般js的getter setter 手法不同。

var scope = $rootScope;           scope.name = 'misko';           scope.counter = 0;                    scope.$watch('name', function(newValue, oldValue) {               //newValue = ""; 这里回事 alibaba,这不是我们要的!!!                       });               scope.name = 'alibaba'           scope.$digest();

第3参数是 boolean , 是说要不要使用angular.equals来进行value is_change的对比方式, 没有用过,应该是和c#差不多,就是对比object的时候是比引用还是比值。

第4参数是 function , 每次$digest(),都会触发一次,不管值有没有改变。(这个是1.3才有的)

 

$watchGroup(watchExpressions, listener);

多个属性监听,但是回调相同的情况下可以使用 , 参数1是 Array<String | Function>

 

$watchCollection(obj, listener);

这个用来监听array或者object的改变,比如 array.push ,obj["x"] = x , 添加新的属性或值的情况。

 

$digest()

执行脏数据监测,dirty check , angular内有很多时候都是自动执行的,manual 执行可以写 $rootScope.$digest() 

 

$destroy();

删除$scope和其子$scope , 所有监听都会清空.

 

$eval([expression], [locals]);

eval 和 js 的eval 类似,是angular自己写的javascript语法解析器,很有心啊,一堆正则一堆 if else.

 参数2可以让我们传入scope, 来处理表达式,返回结果.

 

$apply([exp])

$apply(fn) , fn 跑完会自动触发 $rootScope.$digest(); 

一般上我们自己管理好 $digest()就行了

 

$on 和 $emit

$scope 就好比 elem , 可以把 on,emit 看做是游览器的事件机制。

当你在一个上层的scope绑定了一个事件, 在子层可以调用 $emit来触发,从而传入子层的scope给父层 .

app.controller("ctrl", ["$scope", "$rootScope", function ($scope, $rootScope) {            $scope.name = "1782";            $scope.$on("wawa", function (event, x) {                alert(event.targetScope.name);                alert(event.currentScope.name);            });            }]);        app.controller('ctrl2', ["$scope", "$rootScope", function ($scope, $rootScope) {            $scope.name = "5566";            $scope.$emit("wawa");                }]);

event 是个对象,里面有 targetScope,currentScope,name(事件名字),stopPropagation 方法(调用它阻止冒泡),preventDefault 方法(调用它注重默认事情,不是很理解),

defaultPrevented - {

boolean}: true if preventDefault was called. 这个也了解.

event之后的参数就是$emit时候任意传入的

 

$broadcast(name, args);

上层scope向子层发布事件,反向理解就可以了。

 

 

 

 

转载于:https://www.cnblogs.com/keatkeat/p/3902925.html

你可能感兴趣的文章
前端面试 | 掘金技术征文
查看>>
routable-ios源码解析
查看>>
现代Web开发方法
查看>>
这可能是第二好的自定义 View 教程之绘制
查看>>
自制分布式漏洞扫描
查看>>
waf 绕过的技巧
查看>>
Android鬼点子 如此Q弹!
查看>>
MaxComputeSql性能调优
查看>>
Essay
查看>>
JB的测试之旅-项目流程规范
查看>>
《HTTP权威指南》第二部分 HTTP结构 笔记草稿
查看>>
应用 targetSdk 版本升级指导第二弹
查看>>
ElasticSearch学习笔记 - 钢钢更新
查看>>
网络编程之理论篇
查看>>
Android 面试题集合(2018)
查看>>
Python3入门机器学习(四)- kNN算法的学习与使用
查看>>
Three.js粒子特效,shader渲染初探
查看>>
SAP Cloud for Customer Price-计价简介
查看>>
写个Markdown插件,讲讲Chrome扩展开发
查看>>
CSS Grid布局
查看>>