Angular学习笔记（十五）组件周期钩子之变更检测和DoCheck

变更检测

• Angular的变更检测机制配合zone.js来实现，保证组建变化和页面变化同步
• 浏览器中任何异步事件都会触发检测机制
• 检测模版所有绑定属性，若改变则相应区域会被更新
• 需要注意的是：变更检测机制只会把组件属性的改变反应到模版上，不会改变组件值

Angular如何进行变更检测

每个组件都有属于自己的变更检测器，当任何一个变更检测器检查到变化，zone.js会根据组件的变更检测策略来检查组件，以判断组件是否需要更新它的模版。

检测策略

• Default策略，默认情况下所有组件都使用Default策略
• OnPush策略
  如果所有组件都使用Default策略，不管变更发生在哪个组件上，zone.js会检测整个组件树，但会跳过使用OnPush策略的组件，OnPush策略的组件只有当其输入属性(即@Input)发生改变时，zone.js才会检测这个组件及其子组件。

更改策略，在@component加上changeDetection:ChangeDetectionStrategy.OnPush

DoCheck

检测Angular自身无法捕获的变更并采取行动

• 这个钩子的初次调用是因为数据渲染，而后来的仅仅只是点击input框，也会调用ngDoCheck钩子
• 使用这个钩子时需注意，用在特定事件发生时才触发业务逻辑，否则会造成后台数据过大

demo:
docheck.component.html