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 ...
随机推荐
- 自制按钮图标的两种方法: image sprite和svg字体文件
用image sprite和svg字体文件这两种方法,都能够极大地减少小图形文件的数量, 从而减少服务器请求和带宽需求.提高网页的响应速度. 一.建立SVG字体文件 iconmoon 是一个在线工具, ...
- win10系统搜索不到某些老式打印机
问题: win10系统在设置选项里面搜索打印机,却找不到打印机. 百度了一下: 基本说的是驱动问题. 解决方法: 1.下载lansee局域网扫描软件 2.打开嗅探工具点击开始 3.搜索出来之后,会在共 ...
- C#实现多个PDF合并及去除文字水印功能
实现pdf合并就是使用Spire.Pdf.dll类库的方法,但是注意需要同时引用Spire.Pdf.dll和Spire.License.dll两个类库,且两个类库的版本要一致 String[] fil ...
- tomcat启动问题 严重: End event threw exception
错误信息: 严重: End event threw exception java.lang.NoSuchMethodException: org.apache.catalina.deploy.WebX ...
- 【HP-UNIX】修改HP-UNIX主机名称
原文链接:https://blog.csdn.net/lantianbaiyunbj/article/details/53434537 HP-UX修改主机IP地址 方法一 1.set_parms ho ...
- 简介C#读取XML的方式(转)
在程序中访问进而操作XML文件一般有两种模型,分别是使用DOM(文档对象模型)和流模型,使用DOM的好处在于它允许编辑和更新XML文档,可以随机访问文档中的数据,可以使用XPath查询. XML作用 ...
- Java并发编程随笔
死锁:两个线程互相等待对方释放锁才可以继续运行. 避免死锁的常见方法: 1.避免一个线程同时获取多个锁 2.避免一个线程在锁内同时占用多个资源,尽量保证一个锁只占用一个资源 3.尝试使用定时锁,使用l ...
- Docker镜像操作命令
一.使用Docker镜像 1. 获取镜像 可以使用docker pull命令直接从Docker Hub镜像源来下载镜像.该命令的格式为docker pull NAME[:TAG].其中,NAME是镜像 ...
- pywin32安装教程
下载 pywin32-224-cp37-cp37m-win32.whl 放在 Scripts 目录下,然后cmd 安装 pip install pypiwin32 即可成功 此次安装成功对应的pyth ...
- 查找运行时间超过1天的frmweb进程
EBS中经常会出现一些zombie的frmweb进程,特征是运行时间很长,占用CPU都(1个frmweb进程占用1个CPU线程100%资源)下面脚本是利用awk找到运行时间超过1天的frmweb进程, ...