浅谈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 命名规则 变量命名规则
Feb 25 Javascript
JQuery的一些小应用收集
Mar 27 Javascript
JS面向对象编程 for Cookie
Sep 19 Javascript
JavaScript中的typeof操作符用法实例
Apr 05 Javascript
js实现新年倒计时效果
Dec 10 Javascript
js实现图片淡入淡出切换简易效果
Aug 22 Javascript
html5 canvas 详细使用教程
Jan 20 Javascript
利用imgareaselect辅助后台实现图片上传裁剪
Mar 02 Javascript
JS实现线性表的顺序表示方法示例【经典数据结构】
Apr 11 Javascript
jQuery实现手机号正则验证输入及自动填充空格功能
Jan 02 jQuery
微信小程序实现点击空白隐藏的方法示例
Aug 13 Javascript
解决echarts中横坐标值显示不全(自动隐藏)问题
Jul 20 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
『PHP』PHP截断函数mb_substr()使用介绍
2013/04/22 PHP
PHP中加密解密函数与DES加密解密实例
2014/10/17 PHP
thinkPHP中volist标签用法示例
2016/12/06 PHP
php求数组全排列,元素所有组合的方法总结
2017/03/14 PHP
PHP registerXPathNamespace()函数讲解
2019/02/03 PHP
一些技巧性实用js代码小结
2009/10/14 Javascript
window.addEventListener来解决让一个js事件执行多个函数
2012/12/26 Javascript
js实现图片拖动改变顺序附图
2014/05/13 Javascript
AngularJS初始化过程分析(引导程序)
2014/12/06 Javascript
jQuery实现单击和鼠标感应事件
2015/02/01 Javascript
百度地图自定义控件分享
2015/03/04 Javascript
javascript实现自动输出文本(打字特效)
2015/08/27 Javascript
jquery实现ajax提交表单信息的简单方法(推荐)
2016/08/24 Javascript
NodeJS安装图文教程
2018/04/19 NodeJs
JS定义函数的几种常用方法小结
2019/05/23 Javascript
vue+element加入签名效果(移动端可用)
2019/06/17 Javascript
一篇超完整的Vue新手入门指导教程
2020/11/18 Vue.js
[01:46]TI4西雅图DOTA2前线报道 中国选手抱团调时差
2014/07/08 DOTA
Python计算程序运行时间的方法
2014/12/13 Python
Python 中urls.py:URL dispatcher(路由配置文件)详解
2017/03/24 Python
Python堆排序原理与实现方法详解
2018/05/11 Python
Flask web开发处理POST请求实现(登录案例)
2018/07/26 Python
Python 正则表达式匹配字符串中的http链接方法
2018/12/25 Python
python实现超市商品销售管理系统
2019/11/22 Python
Python识别验证码的实现示例
2020/09/30 Python
阿玛尼美妆加拿大官方商城:Giorgio Armani Beauty加拿大
2017/10/24 全球购物
游戏商店:Eneba
2020/04/25 全球购物
农贸市场管理制度
2014/01/31 职场文书
创业计划书模版
2014/02/05 职场文书
给全校老师的建议书
2014/03/13 职场文书
2014年新农村建设工作总结
2014/12/01 职场文书
2016年小学生教师节广播稿
2015/12/18 职场文书
导游词之杭州岳王庙
2019/11/13 职场文书
MySQL5.7并行复制原理及实现
2021/06/03 MySQL
Python pandas读取CSV文件的注意事项(适合新手)
2021/06/20 Python
Docker官方工具docker-registry案例演示
2022/04/13 Servers