为什么断点会影响我的应用程序的行为？

Question

我已遵循以下说明：

1）在Visual Studio 2017中创建默认的Angular应用程序：File / New / ASP.NET Core Web Application / Angular。

2）将以下代码添加到Counter组件（counter.component.ts），它是模板的一部分：

@HostListener('keydown', ['$event'])
onInput(e: any) {
  if (e.which < 48 || e.which > 57) {
      e.preventDefault();
  }
}

3）替换：counter.component.html与此：

<input type="text" placeholder="Volume" numericControl />

运行应用程序，然后导航到计数器URL。一切都按预期工作，即输入框仅允许数字。但是，然后我向@HostListener添加一个断点，并在按输入框内的一个键时到达该断点-在输入框中将不显示任何内容。删除断点后，数字将再次按预期出现在输入框中。为什么会这样？

Answer 1

[Angular Zone正在事件侦听器上超时，并且Angular正在中止侦听器以保护应用程序的性能。

您会在/src/app/polyfills.ts文件中找到加载的区域，并且如果禁用区域的使用，该事件将不会终止。

我试图找到支持文档来支持我的回答，但可惜的是，Angular的这一领域文献很少。