Bagaimanakah Saya Boleh Menggunakan Ungkapan Bersyarat dengan AngularJS ngClass?

Ungkapan Bersyarat dalam AngularJS ngClass

Arahan AngularJS ngClass membolehkan anda menggunakan kelas CSS secara bersyarat pada elemen HTML berdasarkan ungkapan boolean. Untuk membuat ungkapan bersyarat, anda boleh menggunakan sintaks berikut:

ng-class="{test: condition}"

Di mana syarat ialah ungkapan JavaScript yang menilai kepada benar atau salah.

Contoh:

Andaikan anda mempunyai objek obj dengan nilai sifat1 ditetapkan kepada 'nilai lain'. Anda boleh menggunakan 'ujian' kelas CSS secara bersyarat pada elemen menggunakan ungkapan ngClass berikut:

<span ng-class="{test: obj.value1 == 'someothervalue'}">test</span>

Jika obj.value1 bersamaan dengan 'someothervalue', kelas 'test' akan digunakan pada elemen .

Ungkapan Benar dan Palsu:

Yang Arahan ngClass menilai ungkapan sebagai nilai 'benar' atau 'palsu'. Nilai kebenaran (cth., 'true', '1', 'ya') akan menggunakan kelas, manakala nilai falsey (cth., 'false', '0', 'no') tidak akan menggunakan kelas.

Ungkapan Kompleks:

Jika logik bersyarat anda menjadi terlalu kompleks, anda boleh menggunakan fungsi yang mengembalikan a nilai truthy atau falsey.

Contoh:

<span ng-class="{test: checkValue1()}">test</span>

$scope.checkValue1 = function() {
  return $scope.obj.value === 'somevalue';
}

Ungkapan Logik:

Anda juga boleh menggunakan operator logik untuk membentuk ungkapan logik dalam ngClass.

Contoh:

ng-class="{'test': obj.value1 == 'someothervalue' || obj.value2 == 'somethingelse'}"

Ungkapan ini akan menggunakan kelas 'ujian' jika sama ada obj.value1 sama dengan 'someothervalue' atau obj.value2 ialah sama dengan 'sesuatu yang lain'.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggunakan Ungkapan Bersyarat dengan AngularJS ngClass?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!