markForCheck abstract method

void markForCheck()

Marks this and all ChangeDetectionStrategy.OnPush ancestors as dirty.

Components that use changeDetection: ChangeDetectionStrategy.OnPush are only checked once (after creation), and are no longer considered "dirty" until either:

  • The identity of an expression bound to an @Input() changes.
  • An event binding or output bound to the component's template is invoked.
  • This method (markForCheck) is called.

Use markForCheck when Angular would otherwise not know that the state of the component has changed - for example if an async function was executed or an observable model has changed:

@Component(
  selector: 'on-push-example',
  template: 'Number of ticks: {{ticks}}",
  changeDetection: ChangeDetectionStrategy.OnPush,
)
class OnPushExample implements OnDestroy {
  Timer timer;

  var ticks = 0;

  OnPushExample(ChangeDetectorRef changeDetector) {
    timer = Timer.periodic(Duration(seconds: 1), () {
      ticks++;
      changeDetector.markForCheck();
    });
  }

  @override
  void ngOnDestroy() {
    timer.cancel();
  }
}

For those familiar with more reactive frameworks (Flutter, React), markForCheck operates similar to the setState(...) function, which ultimately marks the component or widget as dirty.

Implementation

void markForCheck();