一、现象

全屏页面中的图表,在很多的时候需要 resize 一把,以适应页面的大小变化

二、解决

1、引入 :

import { Observable } from 'rxjs';

2、使用(在ngOnInit方法中):

 

ngOnInit() {
  // 页面监听
  Observable.fromEvent(window, 'resize')
  .debounceTime(100) // 以免频繁处理
  .subscribe((event) => {
    // 这里处理页面变化时的操作
  console.log('come on ..');
  });
} 三、总结 研究有没有更多的方法可以在切换时,注销这些监听?以免出现内存泄漏。尽可能在
ngOnDestroy() 方法中
												

angular2监听页面大小变化的更多相关文章

  1. vue监听页面大小变化重新刷新布局

    在项目中由于某些div元素在布局的时候需要初始化宽高,因为当浏览器缩小屏幕的时候需要重新刷新页面视图. 分析思路: 1.在store中创建state,用于保存当前浏览器的宽.高值. 2.在mounte ...

  2. vue 监听页面宽度变化 和 键盘事件

    vue 监听页面窗口大小 export default { name: 'Full', components: { Header, Siderbar }, data () { return { scr ...

  3. webview缓存及跳转时截取url地址、监听页面变化

    缓存及一些设定 我在做一些项目时,h5做的项目手机浏览器能使用,但是在搬到webview时候不能用,这个时候通过查阅资料,原来是webview没有设定好,包括缓存.缓存大小及路径等等 mWebview ...

  4. 详解vuex结合localstorage动态监听storage的变化

    这篇文章主要介绍了详解vuex结合localstorage动态监听storage的变化,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 需求:不同组件间共用同一数据,当一个 ...

  5. JavaScript监听页面可见性(焦点)同时改变title的三种方法

    JavaScript监听页面可见性(焦点)同时改变title的三种方法 本文参考了https://developer.mozilla.org/zh-CN/docs/Web/API/Page_Visib ...

  6. HTML5 oninput实时监听输入框值变化的完美方案

    在网页开发中经常会碰到需要动态监听输入框值变化的情况,如果使用 onkeydown.onkeypress.onkeyup 这个几个键盘事件来监测的话,监听不了右键的复制.剪贴和粘贴这些操作,处理组合快 ...

  7. 【转载】实时监听输入框值变化的完美方案:oninput & onpropertychange

    oninput 是 HTML5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有 ...

  8. 实时监听输入框值变化:oninput & onpropertychange

    结合 HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件来监听输入框值变化. oninput 是 HTML5 的标准事件,对于检测 textarea, i ...

  9. js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange

    (1)     先说jquery, 使用 jQuery 库的话,只需要同时绑定 oninput 和 onpropertychange 两个事件就可以了,示例代码: $('#username').bin ...

随机推荐

  1. 基于kettle的简单HTTP接口监控

        需求:监控系统中使用的所有http接口,要求简单,易用. 一般的思路也就是发送get/post请求,然后检查接口的响应结果. 如果写代码,要处理http请求,检查http响应,实现发邮件,写d ...

  2. (Python基础)文件操作

    对文件操作流程 打开文件,得到文件句柄并赋值给一个变量 通过句柄对文件进行操作 关闭文件 现有文件如下 命名为7 years Once I was seven years old my momma t ...

  3. [C#]左移和右移

    参考链接: https://www.cnblogs.com/tjudzj/p/4190878.html https://www.cnblogs.com/wwwzzg168/p/3570152.html ...

  4. C#通过COM组件调用IDL的pro程序

    如果在“COM_IDL_connectLib.COM_IDL_connect oComIDL = new COM_IDL_connectLib.COM_IDL_connect();”步骤提示“...8 ...

  5. php进阶--菜鸟之路

    希望有所帮助! 第一阶段:基础阶段(基础PHP程序员) 重点:把LNMP搞熟练(核心是安装配置基本操作) 目标:能够完成基本的LNMP系统安装,简单配置维护:能够做基本的简单系统的PHP开发:能够在P ...

  6. JdbcTemplate 多数据源 jdbc

    参考: https://www.cnblogs.com/tangzekai/p/7782773.html 配置: package top.zekk.twodatasource.config; impo ...

  7. C#操作Access数据库中遇到的问题(待续)

    (1)在向Access中插入数据时,显示语法错误,后来将生成的sql语句单独拿到Access数据库中运行,能正确插入数据,从网上寻找资料,有人的sql语句正常,但是该语句在Access中运行错误,错误 ...

  8. 没有upcast 也不会发生多态

    class A{ public: virtual void f(){ cout << "A::f()"<<endl;} }; class B:public ...

  9. anujs1.4.0发布

    经过三个月的埋头苦干,终于完成Fiber版的anujs. 主要特性有: 测试全部改成jest, 迁移官方测试用例.有许多迷你React吹得怎么天花乱坠,但是生命周期钩子的执行顺序无法与官方保持一致,那 ...

  10. LevelDB源码分析-Version

    Version VersionSet类 VersionSet管理整个LevelDB的当前状态: class VersionSet { public: // ... // Apply *edit to ...