浅谈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在事件监听方面的兼容性小结
Apr 07 Javascript
前端开发的开始---基于面向对象的Ajax类
Sep 17 Javascript
用js传递value默认值的示例代码
Sep 11 Javascript
js分页工具实例
Jan 28 Javascript
js实现有时间限制消失的图片方法
Feb 27 Javascript
聊一聊Vue.js过渡效果
Sep 07 Javascript
jquery删除table当前行的实例代码
Oct 07 Javascript
jQuery实现标签页效果实战(4)
Feb 08 Javascript
jQuery实现frame之间互通的方法
Jun 26 jQuery
如何为vuex实现带参数的 getter和state.commit
Jan 04 Javascript
vue2.0实现的tab标签切换效果(内容可自定义)示例
Feb 11 Javascript
JavaScript或jQuery 获取option value值方法解析
May 12 jQuery
详解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
php自动获取目录下的模板的代码
2010/08/08 PHP
获取用户Ip地址通用方法与常见安全隐患(HTTP_X_FORWARDED_FOR)
2013/06/01 PHP
php文件夹的创建与删除方法
2015/01/24 PHP
Yii 2.0如何使用页面缓存方法示例
2017/05/23 PHP
jquery中选择块并改变属性值的方法
2013/07/31 Javascript
javascript得到当前页的来路即前一页地址的方法
2014/02/18 Javascript
JavaScript实现俄罗斯方块游戏过程分析及源码分享
2015/03/23 Javascript
基于javascript实现九宫格大转盘效果
2020/05/28 Javascript
Struts2+jquery.form.js实现图片与文件上传的方法
2016/05/05 Javascript
jQuery实用密码强度检测
2017/03/02 Javascript
Swiper 4.x 使用方法(移动端网站的内容触摸滑动)
2018/05/17 Javascript
vue页面切换过渡transition效果
2018/10/08 Javascript
在React中写一个Animation组件为组件进入和离开加上动画/过度效果
2019/06/24 Javascript
bootstrap-table+treegrid实现树形表格
2019/07/26 Javascript
Node.js API详解之 string_decoder用法实例分析
2020/04/29 Javascript
浅析JavaScript 函数防抖和节流
2020/07/13 Javascript
Python中if __name__ == "__main__"详细解释
2014/10/21 Python
python通过定义一个类实例作为ftp回调方法
2015/05/04 Python
在Python的Flask框架中构建Web表单的教程
2016/06/04 Python
TensorFlow实现创建分类器
2018/02/06 Python
Pyinstaller打包.py生成.exe的方法和报错总结
2019/04/02 Python
numpy ndarray 按条件筛选数组,关联筛选的例子
2019/11/26 Python
python使用ctypes调用扩展模块的实例方法
2020/01/28 Python
python里的单引号和双引号的有什么作用
2020/06/17 Python
Joe Fresh官网:加拿大时尚品牌和零售连锁店
2016/11/30 全球购物
Troy-Bilt官网:草坪割草机、吹雪机、分蘖机等
2019/02/19 全球购物
365 Tickets英国:全球景点门票
2019/07/06 全球购物
自我评价范文分享
2014/01/04 职场文书
环卫工作汇报材料
2014/10/28 职场文书
2015元旦文艺汇演主持稿(开场白+结束语)
2014/12/14 职场文书
幼儿园大班开学寄语(2015秋季)
2015/05/27 职场文书
教育读书笔记
2015/07/02 职场文书
标枪加油稿
2015/07/22 职场文书
如何在Python中创建二叉树
2021/03/30 Python
SpringBoot集成Druid连接池连接MySQL8.0.11
2021/07/02 Java/Android
Go语言入门exec的基本使用
2022/05/20 Golang