问题描述
- 我打开Chrome
- 我开始了一次新的堆叠闪电战（第10版）
- 已添加到app.component
ngDoCheck() { console.log('why is this checked without anything happen') } - 我什么也没做，甚至没有浏览该标签。
- 为什么changeDetection一遍又一遍地运行？这似乎是对计算的严重浪费。
https://stackblitz.com/edit/angular-ivy-4f8crv?file=src%2Fapp%2Fapp.component.ts
编辑：
- 绘图扭曲发生在chrome上。不在Firefox上。
Edit2：
我可以确认它是我的linix 83 ... chrome版本中突出的“错误”。最新的没有显示这样的问题。因此，我正在关闭这个。
解决方法
编辑：该解决方案正在更新为最新版本的Chrome。
在您的StackBlitz示例中，我看不到它被“无休止地”检查了。该应用会加载，并且会运行两次，此后不会再次运行。
在真实的应用程序中，无疑它将得到更多的检查，并且我对您的StackBlitz here进行了分叉，以演示发生这种情况的原因。请注意与文本输入进行交互是如何经常触发它的？
This的文章很好地解释了Angular Change Detection，并且互联网上还有许多其他文章，但是我将在此处发布其摘要。
修补了以下常用的浏览器机制，以支持更改检测： 所有浏览器事件（单击，鼠标悬停，键入等） setTimeout（）和setInterval（） Ajax请求 实际上，Zone.js已修补了许多其他浏览器API，以透明地触发Angular更改检测，例如Websockets。看一下Zone.js测试规范，看看当前支持什么。
从本质上讲，为确保您的Angular应用能够显示其应显示的数据，它需要在确定可能会更新应用启动状态的任何事件之后运行此检查。
有很多方法可以减少执行此检查的时间，但是通常可以使您最大程度地受益的方法是OnPush变更检测策略，您可以配置组件以使用。使用此策略可以告诉您的组件仅在组件中的输入的 reference 发生更改，组件中的事件或其子项中的一个事件被触发或我们明确运行更改检测时才触发更改检测。