Angular使用window对象中的事件最好不要像使用jQuery那样使用 如下:

注:写事件直接绑定到window对象上了,组件销毁时这个事件没有解绑

可以使用剪头函数不用声明that

注:这样写在组件销毁后依然会存在window对象中。 即使手动在组件的ngOnDestory()方法中去解绑这个事件,依然会有错误。待研究

解决办法:使用angular自带的宿主来实现 具体如下。

1. 使用host

2. 使用HostListener

推荐使用第二种方式。

*转载请附出处

参考: https://stackoverflow.com/questions/35527456/angular-window-resize-event/35527852#35527852

   https://zhuanlan.zhihu.com/p/26309903

angular4 使用window事件的更多相关文章

  1. JavaScript 获取按键,并屏蔽系统 Window 事件

    // JavaScript 获取按键,并屏蔽系统 Window 事件 window.document.onkeydown = onkeydown; function onkeydown(event) ...

  2. angular 使用window事件

    1. 使用host   2. 使用HostListener 推荐使用第二种方式. 不推荐下面的方法,虽然也能进行window事件的绑定,但组件销毁后,window事件任然保留,即使手动在组件的ngOn ...

  3. window事件

    window事件是较为重要的事件,接下来就讲解一下. 1.获取页面滚动栏的距离 什么是滚动栏,就是网页内容过多时,通过滚轮控制上下显示或者左右显示: 为窗口添加滚动条事件: window.onscro ...

  4. Angular4的dom事件

    Angular4的dom事件 差值表达式和属性绑定其实是一样的(例) <!-- 这两个是一样的效果,使用哪个都可以 --> <img src="{{imgUrl}}&quo ...

  5. (非妙味3):浏览器window事件:及浏览各种尺寸介绍

    (触发)window.onload;  window.onscroll;   window.onresize; (兼容)网页可视区尺寸.网页全文尺寸.滚动距离 (实例)广告块高度动态居中.回到顶部   ...

  6. 加载window事件

    $(document).ready()和window.onload的区别 发表于 2012-08-29 由 admin 以浏览器装载文档为例,在页面加载完毕后,浏览器会通过JavaScript为DOM ...

  7. WPF中常用的Window事件

    官方链接:https://msdn.microsoft.com/en-us/library/system.windows.window.statechanged(v=vs.110).aspx 1. A ...

  8. jquery自定义window事件

    <body> <a href='https://www.baidu.com/'>百度</a> </body> <script type=" ...

  9. window对象,BOM,window事件,延时器,DOM

    01.定时器补充 function fn(){    console.log(1);}setInterval("fn()",100);  //定时器调用匿名函数/*   funct ...

随机推荐

  1. Centos 7 下搭建 Dokuwiki

    Centos 7 下搭建 Dokuwiki # Dokuwiki 是php的,所以要先搭建php环境,下载 apache和php,第1.2步下载完,相关的依赖都会下载## 1.下载 httpdyum ...

  2. select多选框

    select多选框 效果: 代码: <HTML> <HEAD> <TITLE>选择下拉菜单</TITLE> <meta http-equiv=&q ...

  3. 用sqoop将mysql的数据导入到hive表中

    1:先将mysql一张表的数据用sqoop导入到hdfs中 准备一张表 需求 将 bbs_product 表中的前100条数据导 导出来  只要id  brand_id和 name 这3个字段 数据存 ...

  4. MSSQL 基础知识002

    ---启用sa账号 1. 先使用一个windows账号登陆. 2.在数据库实例上面右键,属性,安全性,登录名,sa. 右键,属性. 常规,修改sa的密码. 状态,启用sa账号. 主键的作用: 1.唯一 ...

  5. java.lang.NoClassDefFoundError: HttpServletRequest

    在eclipse里启动tomcat报错,错误日志:Caused by: java.lang.ClassNotFoundException: HttpServletRequest 在build path ...

  6. perf + 火焰图分析程序性能

    1.perf命令简要介绍 性能调优时,我们通常需要分析查找到程序百分比高的热点代码片段,这便需要使用 perf record 记录单个函数级别的统计信息,并使用 perf report 来显示统计结果 ...

  7. php隐藏WEBSHELL技巧

    把shell添加到网站logo图片里: cat logo.png shell.php > logo.png 在网站任意一个php文件里添加下面的最简单方法: fputs(fopen('/home ...

  8. IP负载均衡技术

    参考链接:http://www.360doc.com/content/12/1117/19/820209_248442094.shtml

  9. 使用ExtJS做一个用户的增删改查

    extjs版本为4.2,用户数据放在静态list中存储 User.java package com.ext.demo.dao; public class User { private int id; ...

  10. 发布PHP项目(nginx+PHP7+mysql 5.6)

    一.环境检查 1.检查nginx ps -ef | grep "nginx" 显示如下内容则代表nginx启动正常 root 3285 1 0 12:57 ? 00:00:00 n ...