如何防止或取消全局 keydown 事件的更改检测

Con*_*Fan 6 angular

在 Chrome 中进行调试以查找应用程序中响应缓慢的根源时,我注意到在“性能”选项卡中按住该Shift键会生成重复keydown事件,每个事件都会触发 Angular 中的更改检测。下图显示了其中之一的“性能”选项卡。这些事件对我的应用程序没有用;我知道当ShiftCtrl受到自身压力时,什么都不会改变。我只想知道当发生单击事件时,或者当按下字符或功能键时,按键是否按下。“性能”选项卡中报告的额外活动也使得分析我的调试实际感兴趣的内容变得更加困难。

有没有办法防止或取消对和keydown等键的全局事件的更改检测?ShiftCtrl

在此输入图像描述

Con*_*Fan 8

我实际上已经实现了一个全局捕获keydown事件侦听器来停止事件的传播keydown,但我在识别键时犯了一个错误。如果正确完成,globalZoneAwareCallback处理部分将被消除(在问题图像的右侧);剩下的部分globalZoneAwareCaptureCallback


解决方案是停止全局事件侦听器中的事件传播keydown,该侦听器本身不会触发更改检测:

  • 设置事件的全局事件监听器keydown(例如在服务中)
  • Shift停止和Ctrl键的事件传播
  • 将调用包装到window.document.addEventListener里面NgZone.runOutsideAngular。这很重要,因为addEventListener会触发角度变化检测,与我最初的想法相反。
this.zone.runOutsideAngular(() => {
    window.document.addEventListener("keydown", (event: KeyboardEvent) => { 
        switch (event.which || event.keyCode) {
            case 16:
            case 17: {
                event.stopPropagation();
                break;
            }
        }
    });
});
Run Code Online (Sandbox Code Playgroud)

感谢@ashfaq.p@Nour关于 的建议NgZone.runOutsideAngular