angular2监听页面大小变化
一、现象
全屏页面中的图表,在很多的时候需要 resize 一把,以适应页面的大小变化
二、解决
1、引入 :
import { Observable } from 'rxjs';
2、使用(在ngOnInit方法中):
ngOnInit() {
// 页面监听
Observable.fromEvent(window, 'resize')
.debounceTime(100) // 以免频繁处理
.subscribe((event) => {
// 这里处理页面变化时的操作
console.log('come on ..');
});
} 三、总结 研究有没有更多的方法可以在切换时,注销这些监听?以免出现内存泄漏。尽可能在
ngOnDestroy() 方法中
angular2监听页面大小变化的更多相关文章
- vue监听页面大小变化重新刷新布局
在项目中由于某些div元素在布局的时候需要初始化宽高,因为当浏览器缩小屏幕的时候需要重新刷新页面视图. 分析思路: 1.在store中创建state,用于保存当前浏览器的宽.高值. 2.在mounte ...
- vue 监听页面宽度变化 和 键盘事件
vue 监听页面窗口大小 export default { name: 'Full', components: { Header, Siderbar }, data () { return { scr ...
- webview缓存及跳转时截取url地址、监听页面变化
缓存及一些设定 我在做一些项目时,h5做的项目手机浏览器能使用,但是在搬到webview时候不能用,这个时候通过查阅资料,原来是webview没有设定好,包括缓存.缓存大小及路径等等 mWebview ...
- 详解vuex结合localstorage动态监听storage的变化
这篇文章主要介绍了详解vuex结合localstorage动态监听storage的变化,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 需求:不同组件间共用同一数据,当一个 ...
- JavaScript监听页面可见性(焦点)同时改变title的三种方法
JavaScript监听页面可见性(焦点)同时改变title的三种方法 本文参考了https://developer.mozilla.org/zh-CN/docs/Web/API/Page_Visib ...
- HTML5 oninput实时监听输入框值变化的完美方案
在网页开发中经常会碰到需要动态监听输入框值变化的情况,如果使用 onkeydown.onkeypress.onkeyup 这个几个键盘事件来监测的话,监听不了右键的复制.剪贴和粘贴这些操作,处理组合快 ...
- 【转载】实时监听输入框值变化的完美方案:oninput & onpropertychange
oninput 是 HTML5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有 ...
- 实时监听输入框值变化:oninput & onpropertychange
结合 HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件来监听输入框值变化. oninput 是 HTML5 的标准事件,对于检测 textarea, i ...
- js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange
(1) 先说jquery, 使用 jQuery 库的话,只需要同时绑定 oninput 和 onpropertychange 两个事件就可以了,示例代码: $('#username').bin ...
随机推荐
- C7.cpp
Arr[i]==*(ar+i) &arr[i]==ar+i 编译过程的最终产品是可执行程序------由一组机器语言指令组成 内联函数的优点是速度快,但是会占用很多内存,若是在 ...
- js实现输入某串数字,构建完全二叉树,并判断是否为二叉搜索树
思路:若为二叉搜索树,则中序遍历为递增的 let arr = [15,8,16,6,10];let pindex = [];function Node(){ this.root = null; thi ...
- GC的过程
哪些内存需要GC 判断对象是否还存活 引用计数法 给对象中添加一个引用计数器,每当一个地方引用它时,计数器值就加1:当引用失效时,计数器的值就减1,任何时候计数器为0的对象就是不可能再被使用的. 微软 ...
- python3 数独
数独 最近在网上看到数独,感觉非常有意思,所以就来实现以下. 一个数独题的网站(https://www.oubk.com/DailySudoku/17778/1),偷懒直接爬虫抓下来了,哈哈 代码实现 ...
- PyQt5实现邮件合并功能(GUI)
1. 实战Word批量 需要处理批量替换word的一些数据,数据源从Excel中来. Excel的百分数会变为数字,以及浮点数会多好多精度,为了原汁原味的数据,直接复制数据到文本文件.通过\t来分隔即 ...
- 代码:PC CSS(工作中用)
常规内容区域的:标题和文字 2016-5-23 .p16{font-size:16px;color:#333;}/* 16号#333的标题 */ .p12-gray{font-size:16px;co ...
- 稀疏矩阵 part 1
▶ 图片参考[http://www.bu.edu/pasi/files/2011/01/NathanBell1-10-1000.pdf] ▶ 各种系数矩阵的数据结构 ● MAT,原始矩阵数据 type ...
- Hive实现交叉二维分析的小语句
1. 梳理出你要的列和行维度 列维度: 每一周 行维度: 年级 + 学科 + 班型 2. 对数据按周增序进行聚合 (即根据列维度) ,生成list concat_ws 和 collect_list ( ...
- PID控制器介绍
在维基百科上查到的PID的介绍,收藏一下,慢慢看. https://zh.wikipedia.org/wiki/PID%E6%8E%A7%E5%88%B6%E5%99%A8#%E6%AF%94%E4% ...
- python学习(list增删改查、及常用方法)
1.Python多条件判断: 多条件判断if: passelse: pass循环 while for i = 0 while i > 1: print('hello') else: print( ...