浅谈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 & DHTML 实例编程(教程)DOM基础和基本API
Jun 02 Javascript
jquery 实现的全选和反选
Apr 15 Javascript
Jquery + Ajax调用webService实例代码(asp.net)
Aug 27 Javascript
jQuery用unbind方法去掉hover事件及其他方法介绍
Mar 18 Javascript
Node.js读写文件之批量替换图片的实现方法
Sep 07 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
May 17 Javascript
Vue+Jwt+SpringBoot+Ldap完成登录认证的示例代码
May 21 Javascript
axios 封装上传文件的请求方法
Sep 26 Javascript
实用的 vue tags 创建缓存导航的过程实现
Dec 03 Vue.js
vue使用exif获取图片旋转,压缩的示例代码
Dec 11 Vue.js
Vue 3自定义指令开发的相关总结
Jan 29 Vue.js
详解React中共享组件逻辑的三种方式
Feb 02 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实现全角字符转为半角方法汇总
2015/07/09 PHP
PHP基于imagick扩展实现合成图片的两种方法【附imagick扩展下载】
2017/11/14 PHP
屏蔽Flash右键信息的js代码
2010/01/17 Javascript
动态创建样式表在各浏览器中的差异测试代码
2011/09/13 Javascript
js无刷新操作table的行和列
2014/03/27 Javascript
iframe窗口高度自适应的又一个巧妙实现思路
2014/04/04 Javascript
如何利用JS通过身份证号获取当事人的生日、年龄、性别
2016/01/22 Javascript
详解JS数据类型的值拷贝函数(深拷贝)
2017/07/13 Javascript
史上最全JavaScript常用的简写技巧(推荐)
2017/08/17 Javascript
node.js中http模块和url模块的简单介绍
2017/10/06 Javascript
浅谈针对Vue相同路由不同参数的刷新问题
2018/09/29 Javascript
Vue press 支持图片放大功能的实例代码
2018/11/09 Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
2018/11/20 jQuery
浅谈Angular单元测试总结
2019/03/22 Javascript
微信打开网址添加在浏览器中打开提示的办法
2019/05/20 Javascript
Vue实现兄弟组件间的联动效果
2020/01/21 Javascript
JS组件库AlloyTouch实现图片轮播过程解析
2020/05/29 Javascript
JS可断点续传文件上传实现代码解析
2020/07/30 Javascript
python使用urllib模块和pyquery实现阿里巴巴排名查询
2014/01/16 Python
Python中pygame的mouse鼠标事件用法实例
2015/11/11 Python
Python开发的HTTP库requests详解
2017/08/29 Python
windows下安装python的C扩展编译环境(解决Unable to find vcvarsall.bat)
2018/02/21 Python
利用pandas将numpy数组导出生成excel的实例
2018/06/14 Python
Python BS4库的安装与使用详解
2018/08/08 Python
python实现创建新列表和新字典,并使元素及键值对全部变成小写
2019/01/15 Python
win7下 python3.6 安装opencv 和 opencv-contrib-python解决 cv2.xfeatures2d.SIFT_create() 的问题
2019/10/24 Python
python DES加密与解密及hex输出和bs64格式输出的实现代码
2020/04/13 Python
python不同系统中打开方法
2020/06/23 Python
美国知名的摄影器材销售网站:Adorama
2017/02/01 全球购物
三只松鼠官方旗舰店:全网坚果销售第1
2017/11/25 全球购物
.NET常见笔试题集
2012/12/01 面试题
圣诞节活动策划方案
2014/06/09 职场文书
贸易经济专业自荐书
2014/06/29 职场文书
总账会计岗位职责
2015/04/02 职场文书
运动会开幕式通讯稿
2015/07/18 职场文书
初中语文教学反思范文
2016/03/03 职场文书