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 ...
随机推荐
- redis(1)--redis3.2.8安装
一.下载安装包 http://download.redis.io/releases/ 选择对应的版本 二.copy到对应的虚拟机上 运行 tar -zxvf redis-3.2.8 进行解压 更改 ...
- python3 正则匹配[^abc]和(?!abc)的区别(把多个字符作为一个整体匹配排除)
目的:把数字后面不为abc的字符串找出来 如1ab符合要求,2abc不符合要求 str = '1ab' out = re.match(r'\d+(?!abc)',str) str1 = '1abc' ...
- 2018-2019-2 网络对抗技术 20165304 Exp5 MSF基础应用
2018-2019-2 网络对抗技术 20165304Exp5 MSF基础应用 原理与实践说明 1.实践原理 1).MSF攻击方法 主动攻击:扫描主机漏洞,进行攻击 攻击浏览器 攻击其他客户端 2). ...
- Spring 整合WebSocket, Error during WebSocket handshake: Unexpected response code: 302 还有200的错误
springboot 集成websocket 及其简单,,,但是管理端使用的是Spring,原生配置,发生这个错误,,,302 被重定向了...我起的是本地locallhost,把ip换成 local ...
- 【题解】洛谷 P1014 【Cantor表】
1. 我们先引入三角形数的概念: >定数目的点或圆在等距离的排列下可以形成一个等边三角形,这样的数被称为三角形数. >古希腊著名科学家毕达哥拉斯把数1,3,6,10,15,21……这些数量 ...
- java split方法
String a = "O|O||"; System.out.println(a.split("\\|").length); //["O", ...
- 20175213 2018-2019-2 《Java程序设计》第9周学习总结
教材学习内容总结 根据课本的介绍下载了MySQL和Navicat for MySQL并成功对后者进行破解: 操作方法可分为三步: 一.配置程序--让我们程序能找到数据库的驱动jar包 1.把.jar文 ...
- 在anaconda下安装已经下载好Opencv4的痛苦回忆
来来回回装了很多回,今天终于一鼓作气把它安装好,记录一下过程. 准备: Opencv4的安装包,可以在官网上下载 anaconda——主要目的是在anaconda下的某个environment中安装最 ...
- 基于DPDK的高效包处理系统
一.概念 Intel® DPDK全称Intel Data Plane Development Kit,是intel提供的数据平面开发工具集,为Intel architecture(IA)处理器架构下用 ...
- python中的函数和变量
本节内容 函数的定义方法 函数功能 函数的返回值 函数的形参与实参 全局变量与局部变量 递归 函数的作用域 匿名函数lambda 函数式编程 常用内置函数 其他内置函数 函数 函数的定义方法 函数就相 ...