Angular2源码解读之ChangeDetection

https://github.com/Leooman/Angular

ChangeDetectionStrategy

Describes within the change detector which strategy will be used the next time change detection is triggered.

• OnPush = 0

OnPush means that the change detector’s mode will be set to CheckOnce during hydration.

• Default = 1

Default means that the change detector’s mode will be set to CheckAlways during hydration

ChangeDetectorStatus

Describes the status of the detector

• CheckOnce = 0

CheckedOnce means that after calling detectChanges the mode of the change detector will become Checked.

• Checked = 1

Checked means that the change detector should be skipped until its mode changes to CheckOnce

• CheckAlways = 2

CheckAlways means that after calling detectChanges the mode of the change detector will remain CheckAlways

• Detached = 3

Detached means that the change detector sub tree is not a part of the main tree and should be skipped

• Errored = 4

Errored means that the change detector encountered an error checking a binding or calling a directive lifecycle method and is now in an inconsistent state. Change detectors in this state will no longer detect changes.

• Destroyed = 5

Destroyed means that the change detector is destroyed

ChangeDetectorRef

object method

export class ChangeDetectorRef {    markForCheck(): void,    detach(): void,    detectChanges(): void,    checkNoChanges(): void,    reattach(): void}

markForCheck

Marks all {@link ChangeDetectionStrategy#OnPush} ancestors as to be checked.

Example

detach

Detaches the change detector from the change detector tree.

The detached change detector will not be checked until it is reattached.

This can also be used in combination with {@link ChangeDetectorRef#detectChanges} to implement local change detection checks.

detectChanges

Checks the change detector and its children.

This can also be used in combination with {@link ChangeDetectorRef#detach} to implement local change detection checks.

Example

For performance reasons,we want to check and update the list every five seconds. We can do that by detaching the component’s change detector and doing a local check every five seconds.

checkNoChanges

Checks the change detector and its children, and throws if any changes are detected.

This is used in development mode to verify that running change detection doesn’t introduce other changes.

reattach

Reattach the change detector to the change detector tree.

This also marks OnPush ancestors as to be checked. This reattached change detector will be checked during the next change detection run.

Example