Angular *ngClass Ralat: Bagaimana untuk Membetulkan 'Tidak boleh membaca 'mengeluarkan' harta yang tidak ditentukan'?

Sudut: Kelas Bersyarat dengan *ngClass

Tugasan kelas bersyarat menggunakan *ngClass ialah teknik Sudut yang berkesan untuk mengubah gaya elemen secara dinamik berdasarkan spesifik syarat. Walau bagaimanapun, menghadapi ralat "Tidak dapat membaca sifat 'alih keluar' yang tidak ditentukan di BrowserDomAdapter.removeClass" menunjukkan isu dengan kod. Mari kita teroka penyelesaian yang mungkin:

Penyelesaian menggunakan Sintaks Kelas Ganti

Angular menyediakan pilihan sintaks alternatif untuk tugasan kelas bersyarat:

• Jenis Satu:

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

• Jenis Dua:

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

• Berbilang Pilihan:

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

• Sintaks seperti Enum:

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

• Ternary Operator:

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

Kod Contoh dengan Sintaks Jenis Satu:

<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>

Sintaks ganti ini mengalih keluar potensi "undefined " ralat dengan menggunakan pengikatan kelas terbina dalam Angular.

Rujuk kepada Dokumentasi rasmi Angular untuk senarai komprehensif pilihan sintaks mengikat kelas.

Atas ialah kandungan terperinci Angular *ngClass Ralat: Bagaimana untuk Membetulkan 'Tidak boleh membaca 'mengeluarkan' harta yang tidak ditentukan'?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!