角度窗口调整大小事件

小编典典

all

我想根据窗口调整大小事件（加载和动态）执行一些任务。

目前我的DOM如下：

<div id="Harbour">
    <div id="Port" (window:resize)="onResize($event)" >
        <router-outlet></router-outlet>
    </div>
</div>

事件正确触发

export class AppComponent {
    onResize(event) {
        console.log(event);
    }
}

如何从此事件对象中检索宽度和高度？

谢谢。

阅读 78

2022-04-14

共1个答案

小编典典

<div (window:resize)="onResize($event)"



onResize(event) {
  event.target.innerWidth;
}

@HostListener('window:resize', ['$event'])
onResize(event) {
  event.target.innerWidth;
}

支持的全局目标是window、document和body。

在Angular
中实现 https://github.com/angular/angular/issues/13248之前，最好强制订阅
DOM 事件并使用 RXJS 来减少事件数量，如其他一些答案所示。

2022-04-14