angular - onResize 事件在我的代码中不起作用,但在角度稍有变化时效果很好
问题描述
@HostListener('window:resize', ['$event'])
@HostBinding('class.blur') isBlur = false;
onResize(event?) {
this.size = window.innerWidth - 50;
}
此代码可能会出现“ctx.isBlur 不是函数”之类的错误
但
@HostBinding('class.blur') isBlur = false;
@HostListener('window:resize', ['$event'])
onResize(event?) {
this.size = window.innerWidth - 50;
}
这段代码运行良好......我不知道为什么......
正如我所料,isBlur = false; 在接收调整大小事件之前未定义。
解决方案
因为@HostListener 需要一个函数来处理并且你给它一个属性。
您发布的两段代码也非常不同。
在下面的代码中,你装饰了 isBlur 的 setfunction 来设置元素的类
@HostBinding('class.blur')
isBlur = false;
在幕后是这样的:
set isBlur(value:boolean) {
this._isBlur = value;
if(value){
this.elementRef.nativeElement.classList.add(className);
}
}
get isBlur() {
return this._isBlur;
}
而方法装饰
@HostListener('window:resize', ['$event'])
onResize(event?) {
this.size = window.innerWidth - 50;
}
是这样的:
decorate() {
document.addEventListener(eventName, (event) => method(event);
}
推荐阅读
- javascript - 在 React 中将组件道具传递给父组件时无法绑定事件
- c++ - c++ ppl.h for linux中的parallel_for
- angularjs - 做一个需要复杂配置输入的 AngularJS 组件是一种好方法吗?
- php - 如何查询 Eloquent 关系,只显示最新记录
- javascript - 使用 Select2 小部件时检索选项名称而不是本地存储 JavaScript 中的值
- msys - bash:git:在 MSYS 中找不到命令
- python - 使用 pandas_profiling 时 Python 中的属性错误
- python - OSerror 导入语言模型 spacy
- https - Traefik 失败 https 重定向
- python - 打印编译的 sqlalchemy 查询