Erreur angulaire *ngClass : comment corriger 'Impossible de lire la propriété 'supprimer' undéfini' ?

Angular : Classe conditionnelle avec *ngClass

L'affectation de classe conditionnelle à l'aide de *ngClass est une technique angulaire efficace pour modifier dynamiquement le style d'un élément en fonction de paramètres spécifiques. conditions. Cependant, la rencontre de l'erreur « Impossible de lire la propriété « supprimer » d'undéfini sur BrowserDomAdapter.removeClass » indique un problème avec le code. Explorons les solutions possibles :

Solution utilisant une syntaxe de classe alternative

Angular fournit des options de syntaxe alternatives pour l'affectation de classe conditionnelle :

• Tapez Un :

  [class.my_class] = "step === 'step1'"

  Copier après la connexion

• Type deux :

  [ngClass]="{'my_class': step === 'step1'}"

  Copier après la connexion

• Plusieurs Options :

  [ngClass]="{'my_class': step === 'step1', 'my_class2' : step === 'step2' }"

  Copier après la connexion

• Syntaxe de type énumération :

  [ngClass]="{1 : 'my_class1', 2 : 'my_class2', 3 : 'my_class4'}[step]"

  Copier après la connexion

• Ternaire Opérateur :

  [ngClass]="step == 'step1' ? 'my_class1' : 'my_class2'"

  Copier après la connexion

Exemple de code avec syntaxe de type 1 :

<ol>
    <li [class.active] = "step==='step1'" (click)="step='step1'">Step1</li>
    <li [class.active] = "step==='step2'" (click)="step='step2'">Step2</li>
    <li [class.active] = "step==='step3'" (click)="step='step3'">Step3</li>
</ol>

Cette syntaxe alternative supprime le potentiel "non défini " erreur en utilisant les liaisons de classe intégrées d'Angular.

Reportez-vous à la documentation officielle d'Angular pour une liste complète des options de syntaxe de liaison de classe.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!