浅谈Angular 观察者模式理解


Posted in Javascript onNovember 01, 2018

观察者模式意图

定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新。

实现过程

在老师教程中学到了 Angularjs 中的观察者模式

不使用观察者模式,登录时不实时获取当前登录用户,必须刷新界面

浅谈Angular 观察者模式理解

使用观察者模式

浅谈Angular 观察者模式理解

代码

Services:

// 观察者
    self.observerCallbacks = [];

    // 注册观察者
    self.reisterObserverCallback = function(callback){
      self.observerCallbacks.push(callback);
    };

    // 通知观察者
    self.notifyObserver = function(currentLoginTeacher){
      angular.forEach(self.observerCallbacks, function(callback){
        callback(currentLoginTeacher);
      });
    };

Controller:

// 注册观察者
          teacher.reisterObserverCallback(function(teacher){
           $scope.data.CurrentLoginTeacher = teacher;
          });
使用时调用self.notifyObserver方法。只要是注册过的观察者都会得到一个通知。

时序图

浅谈Angular 观察者模式理解

总结

观察者模式:我觉得用一个词来总结,就是群发。
当一个对象发生改变的同时,需要其他对象也改变,但是并不知道具体有多少个对象改变。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
小议javascript 设计模式 推荐
Oct 28 Javascript
JavaScript 拾漏补遗
Dec 27 Javascript
javascript写的简单的计算器,内容很多,方法实用,推荐
Dec 29 Javascript
jQuery中after的两种用法实例
Jul 03 Javascript
jQuery中slideUp()方法用法分析
Dec 24 Javascript
深入学习JavaScript的AngularJS框架中指令的使用方法
Mar 05 Javascript
好好了解一下Cookie(强烈推荐)
Jun 14 Javascript
深入理解requestAnimationFrame的动画循环
Sep 20 Javascript
JS加密插件CryptoJS实现的Base64加密示例
Aug 16 Javascript
其实你可以少写点if else与switch(推荐)
Jan 10 Javascript
jquery实现自定义树形表格的方法【自定义树形结构table】
Jul 12 jQuery
vue实现滑动切换效果(仅在手机模式下可用)
Jun 29 Javascript
详解vuex状态管理模式
Nov 01 #Javascript
详解angularjs跨页面传参遇到的一些问题
Nov 01 #Javascript
Vue.js 事件修饰符的使用教程
Nov 01 #Javascript
微信小程序实现蒙版弹窗效果
Nov 01 #Javascript
Vue 页面状态保持页面间数据传输的一种方法(推荐)
Nov 01 #Javascript
JS 音频可视化插件Wavesurfer.js的使用教程
Oct 31 #Javascript
微信小程序实现留言板
Oct 31 #Javascript
You might like
PHP5.2下chunk_split()函数整数溢出漏洞 分析
2007/06/06 PHP
php给数组赋值的实例方法
2019/09/26 PHP
laravel实现Auth认证,登录、注册后的页面回跳方法
2019/09/30 PHP
javascript 面向对象编程基础:继承
2009/08/21 Javascript
使用javascript实现判断当前浏览器
2015/04/14 Javascript
jQuery Validate表单验证入门学习
2015/12/18 Javascript
Javascript实现单例模式
2016/01/24 Javascript
EasyUI Combobox设置默认值 获取text的方法
2016/11/28 Javascript
JavaScript实现多栏目切换效果
2016/12/12 Javascript
简单实现IONIC购物车功能
2017/01/10 Javascript
JS数组操作中的经典算法实例讲解
2017/07/26 Javascript
javascript计算渐变颜色的实例
2017/09/22 Javascript
javaScript手机号码校验工具类PhoneUtils详解
2017/12/08 Javascript
JS实现的汉字与Unicode码相互转化功能分析
2018/05/25 Javascript
js实现input密码框显示/隐藏功能
2020/09/10 Javascript
Vue.js 中的实用工具方法【推荐】
2019/07/04 Javascript
Javascript模拟实现new原理解析
2020/03/03 Javascript
简单了解JavaScript arguement原理及作用
2020/05/28 Javascript
JS实现前端路由功能示例【原生路由】
2020/05/29 Javascript
JavaScript实现网页下拉菜单效果
2020/11/20 Javascript
Tornado Web服务器多进程启动的2个方法
2014/08/04 Python
Python中pygame的mouse鼠标事件用法实例
2015/11/11 Python
Python爬虫之模拟知乎登录的方法教程
2017/05/25 Python
利用Python自带PIL库扩展图片大小给图片加文字描述的方法示例
2017/08/08 Python
Pycharm 2019 破解激活方法图文详解
2019/10/11 Python
Django和Flask框架优缺点对比
2019/10/24 Python
tensorflow2.0保存和恢复模型3种方法
2020/02/03 Python
python BeautifulSoup库的安装与使用
2020/12/17 Python
CSS3 边框效果
2019/11/04 HTML / CSS
加拿大休闲和工业服装和鞋类零售商:L’Équipeur
2018/01/12 全球购物
20世纪40年代连衣裙和复古服装:The Seamstress Of Bloomsbury
2018/07/24 全球购物
大学生感恩父母演讲稿
2014/08/28 职场文书
2014年助理政工师工作总结
2014/12/19 职场文书
导游词300字
2015/02/13 职场文书
2015年母亲节寄语
2015/03/23 职场文书
Windows11 Insider Preview Build 25206今日发布 更新内容汇总
2022/09/23 数码科技