Implement this interface to override the default change detection algorithm for your directive.

ngDoCheck gets called to check the changes in the directives instead of the default algorithm.

The default change detection algorithm looks for differences by comparing bound-property values by reference across change detection runs. When DoCheck is implemented, the default algorithm is disabled and ngDoCheck is responsible for checking for changes.

Implementing this interface allows improving performance by using insights about the component, its implementation and data types of its properties.

Note that a directive should not implement both DoCheck and OnChanges at the same time. ngOnChanges would not be called when a directive implements DoCheck. Reaction to the changes have to be handled from within the ngDoCheck callback.

Use KeyValueDiffers and IterableDiffers to add your custom check mechanisms.

Examples

Try this live example from the Lifecycle Hooks page:

ngDoCheck() {
  if (hero.name != oldHeroName) {
    changeDetected = true;
    changeLog.add(
        'DoCheck: Hero name changed to "${hero.name}" from "$oldHeroName"');
    oldHeroName = hero.name;
  }

  if (power != oldPower) {
    changeDetected = true;
    changeLog.add('DoCheck: Power changed to "$power" from "$oldPower"');
    oldPower = power;
  }

  if (changeDetected) {
    noChangeCount = 0;
  } else {
    // log that hook was called when there was no relevant change.
    var count = noChangeCount += 1;
    var noChangeMsg =
        'DoCheck called ${count}x when no change to hero or power';
    if (count == 1) {
      // add new "no change" message
      changeLog.add(noChangeMsg);
    } else {
      // update last "no change" message
      changeLog[changeLog.length - 1] = noChangeMsg;
    }
  }

  changeDetected = false;
}
Implemented by

Constructors

DoCheck()

Properties

hashCode → int
The hash code for this object. [...]
read-only, inherited
runtimeType → Type
A representation of the runtime type of the object.
read-only, inherited

Methods

ngDoCheck() → dynamic
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]
inherited
toString() → String
Returns a string representation of this object.
inherited

Operators

operator ==(other) → bool
The equality operator. [...]
inherited