Open giscafer opened 7 years ago
文章出处：Everything you need to know about change detection in Angular
探索变化检测底层实现和用例
如果你想像我一样，想要全面了解 Angular 的变化检测机制，你就必须探索源码，因为在网上没有太多的信息可查。大多数文章都提到，每个组件都有自己的变更检测器，负责检查组件，但是它们不会超出这个范围，而且主要集中在 不变的 和 变化检测策略的用例上。
本文由两个部分组成。第一部分是相当技术性的，包含了很多相关源码的链接。它详细解释了在生命周期钩子下的变化检测机制是如何工作的。它的内容基于最新的 Angular 版本——4.0.1（现在已经快5.0了，这是作者写文章的时候的版本）。这个版本的引擎盖下的变化检测机制的实现方式与之前的2.4.1有所不同。如果你感兴趣的话，你可以读一下stackoverflow答案。
第二部分展示了如何在应用程序中使用变化检测，它的内容适用于较早的2.4.1和最新的4.0.1版本的Angular，因为 API 没有改变。
在教程中已经提到，一个 Angular 应用程序是一个组件树。然而，在底层下使用一个低级抽象称为视图(view)。视图和组件之间有直接关系——一个视图与一个组件和相互作用关联。视图在组件属性中拥有与相关组件类实例的引用。所有的操作，如属性检查和DOM更新都是在视图上执行的，因此从技术上讲，Angular 是一种视图树，而组件可以被描述为视图的高级概念。你可以阅读的关于view的观点:
视图是应用程序UI的基本构件。它是构成和毁灭在一起的最小元素组合。 视图中元素的属性可以改变，但是视图中的元素的结构(数量和顺序)不能改变。更改元素的结构只能通过在ViewContainerRef 中插入、移动或删除嵌套视图来完成。每个视图可以包含许多视图容器。
视图是应用程序UI的基本构件。它是构成和毁灭在一起的最小元素组合。
视图中元素的属性可以改变，但是视图中的元素的结构(数量和顺序)不能改变。更改元素的结构只能通过在ViewContainerRef 中插入、移动或删除嵌套视图来完成。每个视图可以包含许多视图容器。
在本文中，我将交换地使用组件视图和组件的概念。
这里需要注意的是，关于StackOverflow的所有文章和关于变化检测的答案都提到了我在这里描述的变化检测器对象或 ChangeDetectorRef。在现实中，没有单独的对象来进行变化检测，而视图是变化检测的运行方式。
ChangeDetectorRef
每个视图通过节点属性( nodes property)链接它的子视图，因此可以对子视图执行操作。
文章出处：Everything you need to know about change detection in Angular
探索变化检测底层实现和用例
如果你想像我一样，想要全面了解 Angular 的变化检测机制，你就必须探索源码，因为在网上没有太多的信息可查。大多数文章都提到，每个组件都有自己的变更检测器，负责检查组件，但是它们不会超出这个范围，而且主要集中在 不变的 和 变化检测策略的用例上。
本文由两个部分组成。第一部分是相当技术性的，包含了很多相关源码的链接。它详细解释了在生命周期钩子下的变化检测机制是如何工作的。它的内容基于最新的 Angular 版本——4.0.1（现在已经快5.0了，这是作者写文章的时候的版本）。这个版本的引擎盖下的变化检测机制的实现方式与之前的2.4.1有所不同。如果你感兴趣的话，你可以读一下stackoverflow答案。
第二部分展示了如何在应用程序中使用变化检测，它的内容适用于较早的2.4.1和最新的4.0.1版本的Angular，因为 API 没有改变。
View 作为一个核心概念
在教程中已经提到，一个 Angular 应用程序是一个组件树。然而，在底层下使用一个低级抽象称为视图(view)。视图和组件之间有直接关系——一个视图与一个组件和相互作用关联。视图在组件属性中拥有与相关组件类实例的引用。所有的操作，如属性检查和DOM更新都是在视图上执行的，因此从技术上讲，Angular 是一种视图树，而组件可以被描述为视图的高级概念。你可以阅读的关于view的观点:
在本文中，我将交换地使用组件视图和组件的概念。
这里需要注意的是，关于StackOverflow的所有文章和关于变化检测的答案都提到了我在这里描述的变化检测器对象或
ChangeDetectorRef。在现实中，没有单独的对象来进行变化检测，而视图是变化检测的运行方式。每个视图通过节点属性( nodes property)链接它的子视图，因此可以对子视图执行操作。
View state (视图状态)