浅谈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 尚未实现错误解决办法
Nov 27 Javascript
Extjs中ComboBox加载并赋初值的实现方法
Mar 22 Javascript
从数据结构分析看:用for each...in 比 for...in 要快些
Apr 17 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
Jul 27 Javascript
JavaScript匿名函数之模仿块级作用域
Dec 12 Javascript
JavaScript接口的实现三种方式(推荐)
Jun 14 Javascript
将json转换成struts参数的方法
Nov 08 Javascript
你不知道的 javascript【推荐】
Jan 08 Javascript
微信小程序 生命周期和页面的生命周期详细介绍
Jan 19 Javascript
TypeScript入门-接口
Mar 30 Javascript
layui中使用jquery控制radio选中事件的示例代码
Aug 15 jQuery
vue-drag-chart 拖动/缩放图表组件的实例代码
Apr 10 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
mysql5的sql文件导入到mysql4的方法
2008/10/19 PHP
详解Laravel服务容器的绑定与解析
2019/11/05 PHP
JS实现浏览器菜单命令
2006/09/05 Javascript
JavaScript 事件参考手册
2008/12/24 Javascript
js对数字的格式化使用说明
2011/01/12 Javascript
Jquery取得iframe下内容的方法
2013/11/18 Javascript
js中自定义方法实现停留几秒sleep
2014/07/11 Javascript
网页从弹窗页面单选框传值至父页面代码分享
2015/09/29 Javascript
jquery实现仿新浪微博带动画效果弹出层代码(可关闭、可拖动)
2015/10/12 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
2016/06/03 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
Angularjs 实现移动端在线测评效果(推荐)
2017/04/05 Javascript
功能完善的小程序日历组件的实现
2020/03/31 Javascript
vue 里面的 $forceUpdate() 强制实例重新渲染操作
2020/09/21 Javascript
[05:45]Ti4观战指南(下)
2014/07/07 DOTA
[16:56]heroes英雄教学 司夜刺客
2014/09/18 DOTA
python基于socket实现网络广播的方法
2015/04/29 Python
Python回文字符串及回文数字判定功能示例
2018/03/20 Python
对python .txt文件读取及数据处理方法总结
2018/04/23 Python
英国Flybe航空官网:欧洲最大的独立支线廉价航空公司
2019/07/15 全球购物
向全球直邮输送天然健康产品:iHerb.com
2020/05/03 全球购物
应届生服务员求职信
2013/10/31 职场文书
个性与发展自我评价
2014/02/11 职场文书
善意的谎言事例
2014/02/15 职场文书
职务聘任书范文
2014/03/29 职场文书
师德师风个人自我剖析材料
2014/09/27 职场文书
2014年无财产无子女离婚协议书范本
2014/10/09 职场文书
初中教师个人总结
2015/02/10 职场文书
2015年七年级班主任工作总结
2015/05/21 职场文书
生日祝酒词大全
2015/08/10 职场文书
浅谈如何写好演讲稿?
2019/06/12 职场文书
tensorflow+k-means聚类简单实现猫狗图像分类的方法
2021/04/28 Python
JavaScript与JQuery框架基础入门教程
2021/07/15 Javascript
CSS 一行代码实现头像与国旗的融合
2021/10/24 HTML / CSS
Python实现日志实时监测的示例详解
2022/04/06 Python
win10如何更改appdata文件夹的默认位置?
2022/07/15 数码科技