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
Libérer: 2024-12-02 10:26:11
original
308 Les gens l'ont consulté

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'"
    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>
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal