Angular2获取窗口宽度onResize

新手上路,请多包涵

试图弄清楚如何在 Angular2 中调整事件大小时获取窗口宽度。这是我的代码:

 export class SideNav {

    innerWidth: number;

    constructor(private window: Window){

        let getWindow = function(){
          return window.innerWidth;
        };

        window.onresize = function() {
          this.innerWidth = getWindow();
          console.log(getWindow());
        };
}

我在 bootstrap.ts 文件中全局导入窗口提供程序,使用提供来跨我的应用程序访问窗口。我遇到的问题是这确实给了我一个窗口大小,但是在调整窗口大小时 - 即使窗口改变大小,它也会一遍又一遍地重复相同的大小。有关 console.log 示例,请参见图像: 屏幕截图图像

我的总体目标是能够将窗口编号设置为变量 onresize,以便我可以在模板中访问它。关于我在这里做错了什么的任何想法?

谢谢!

原文由 Spencer Bigum 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 856
1 个回答

使用 NgZone 触发变更检测:

 constructor(ngZone:NgZone) {
    window.onresize = (e) =>
    {
        ngZone.run(() => {
            this.width = window.innerWidth;
            this.height = window.innerHeight;
        });
    };
}

原文由 pixelbits 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题