🅰️ Angular

ExpressionChangedAfterItHasBeenCheckedError

Une valeur affichée dans le template a changé entre la fin du cycle de détection de changements et la vérification de contrôle qu'Angular fait en mode dev.

Message d'erreur
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: ...

🔍 Cause la plus probable

Vous modifiez une donnée liée à la vue dans `ngAfterViewInit` ou pendant le rendu (souvent via un service partagé ou un setter), donc après qu'Angular ait déjà figé la vue.

✅ Solution étape par étape

  1. Déplacez la mise à jour dans `ngOnInit` plutôt que `ngAfterViewInit` quand c'est possible.
  2. Si la valeur doit changer après le rendu, reportez-la d'un tick avec `setTimeout(...)` ou `Promise.resolve().then(...)`.
  3. Avec les signals (Angular 17+), utilisez `computed`/`effect` qui gèrent proprement ce cycle.
ngAfterViewInit() {
  Promise.resolve().then(() => this.title = 'Chargé');
}

🧩 Autres causes possibles

Composant enfant modifiant un @Input du parent

Émettez un événement (`@Output`) au lieu de muter directement la donnée du parent.

Getter qui retourne une nouvelle référence à chaque appel

Mémoïsez la valeur au lieu de recréer un objet/tableau à chaque détection.

🛡️ Comment l'éviter à l'avenir

N'effectuez pas d'effets de bord sur l'état lié à la vue pendant le rendu. Adoptez les signals pour un flux de données prévisible.

🔒 Votre erreur est différente ?

Collez votre message d'erreur dans notre analyseur IA. Traitement anonymisé, rien n'est stocké.

Analyser mon erreur avec l'IA

Bloqué sur un bug plus complexe ?

Nos développeurs Java, Spring & Angular débuggent, optimisent et livrent votre projet.

Parler à un développeur