menu
{$Head.Title}}

Angular HowTo

Angular HowTo Blog

Angular

Expression has Changed After it was checked

Der Fehler "Expression has Changed After it was checked" ist ärgerlich und nicht immer einfach zu beheben. Eine einfache Lösung ist die Behandlung über die Methode ngAfterContentChecked:

export class MyComponent implements AfterContentChecked {
  ...
  constructor(private changeDetectorRef: ChangeDetectorRef) {
  }
  ...
  ngAfterContentChecked(): void {
    this.changeDetectorRef.detectChanges();
  }
  ...
}
Prevent Detect Changes on destroyed views

Angulars Detect Changes sollte nur auf gültige und nicht zerstörte Komponenten angewendet werden, sonst resultiert der folgende Fehler:

EXCEPTION: Attempt to use a destroyed view: detectChanges
Dies kann man wie folgt umgehen:
if (!this.changeDetector.destroyed) {
  this.changeDetector.detectChanges();
}
ChangeDetection Strategy OnPush

Falls Probleme mit der Aktualisierung von Daten z.B. nach einem Page Reload F5 und die OnPush Change Detection Strategie verwendet wird, so hilft in der Methode ngAfterViewInit der Aufruf markForCheck innerhalb Timeout Zero Handling:

ngAfterViewInit() {
  setTimeout(() => {
    this.changeDetectorRef.markForCheck();
  }, 0);
}
Die Referenz this.changeDetectorRef ist vom Typ ChangeDetecorRef und im Konstruktor zu definieren:
constructor(private changeDetectorRef: ChangeDetectorRef) {
}
Feedback

War dieser Blog für Sie wertvoll. Wir danken für jede Anregung und Feedback