What are the ways to trigger change detection in Angular?

You can inject either ApplicationRef or NgZone, or ChangeDetectorRef into your component and apply below specific methods to trigger change detection in Angular. i.e, There are 3 possible ways,

1. ApplicationRef.tick(): Invoke this method to explicitly process change detection and its side-effects. It check the full component tree.
2. NgZone.run(callback): It evaluate the callback function inside the Angular zone.
3. ChangeDetectorRef.detectChanges(): It detects only the components and it's children.

Practical Code Example

// Triggering Change Detection Manually:
import { Component, ChangeDetectorRef, inject } from '@angular/core';

@Component({ selector: 'app-counter', standalone: true, template: '{{ count }}' })
export class CounterComponent {
  private cdr = inject(ChangeDetectorRef);
  count = 0;

  updateManually() {
    this.count = 42;
    this.cdr.detectChanges(); // Triggers change detection on demand!
  }
}