Maison >interface Web >js tutoriel >Erreur angulaire *ngClass : comment corriger 'Impossible de lire la propriété 'supprimer' undéfini' ?

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

DDD
DDDoriginal
2024-12-02 10:26:11358parcourir

Angular *ngClass Error: How to Fix

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'"
  • Type deux :

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

    [ngClass]="{'my_class': step === 'step1', 'my_class2' : step === 'step2' }"
  • Syntaxe de type énumération :

    [ngClass]="{1 : 'my_class1', 2 : 'my_class2', 3 : 'my_class4'}[step]"
  • Ternaire Opérateur :

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

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn