Angular2监听页面大小变化的解决方法
更新时间：2017年10月09日 16:52:11 作者：小老虎网络
这篇文章主要介绍了Angular2监听页面大小变化的解决方法,需要的朋友可以参考下
一、现象
全屏页面中的图表，在很多的时候需要 resize 一把，以适应页面的大小变化
二、解决
1、引入 ：
import { Observable } from 'rxjs';
2、使用(在ngOnInit方法中)：
ngOnInit() {
// 页面监听
Observable.fromEvent(window, 'resize')
.debounceTime(100) // 以免频繁处理
.subscribe((event) => {
// 这里处理页面变化时的操作
console.log('come on ..');
});
}
三、总结
研究有没有更多的方法可以在切换时，注销这些监听？以免出现内存泄漏。尽可能在ngOnDestroy() 方法中。
以上所述是小编给大家介绍的Angular2监听页面大小变化的解决方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
Angular本身监督所有Angular组件和指令的生命周期 。为了在开发应用程序时顺利进行，您必须了解结果的生命周期。组件是任何Angular应用程序的主要构建块。因此，必须了解它们才能理解组件生命周期的处理步骤。只有这样才能在应用程序的开发中实现。2021-05-05
使用Angular CLI快速创建Angular项目的一些基本概念和写法小结
这篇文章主要介绍了使用Angular CLI快速创建Angular项目的一些基本概念和写法小结,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-04-04
AngularJS和django的模板都是用{{}}来引用变量的，这就导致了冲突，所以这篇文章主要就给大家介绍了如何解决Angular.Js与Django标签冲突的方案，有需要的朋友们可以参考借鉴，下面来一起学习学习吧。2016-12-12
Angular中$cacheFactory的作用和用法实例详解
$cacheFactory是一个为Angular服务生产缓存对象的服务。接下来通过本文给大家介绍Angular中$cacheFactory的作用和用法实例详解，非常不错，感兴趣的朋友一起看下吧2016-08-08
Angular中封装fancyBox(图片预览)遇到问题小结
这篇文章主要介绍了Angular中封装fancyBox(图片预览)遇到的问题小结,需要的朋友可以参考下2017-09-09
这篇文章主要介绍了在angular 6中使用 less 的实例代码,非常不错，具有参考借鉴价值，需要的朋友可以参考下2018-05-05
今天小编就为大家分享一篇Angularjs之ngModel中的值验证绑定方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
AngularJS基础 ng-mousemove 指令简单示例
本文主要介绍AngularJS ng-mousemove 指令,这里帮大家整理了ng-mousemove 指令的详细资料,并附有示例代码,有需要的朋友参考下2016-08-08
这篇文章主要介绍了Angular 容器部署的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-04-04
AngularJS是一款优秀的前端JS框架，已经被用于Google的多款产品当中。下面通过本文给大家分享使用AngularJS对表单提交内容进行验证的操作方法，需要的的朋友参考下吧2017-07-07
最新评论