Gaya ngClass dengan tombol dash in

Saya harap ini menghemat sakit kepala seseorang dengan gaya yang menggunakan tanda hubung, terutama karena bootstrap telah menjadi begitu populer.

Saya menggunakan sudut 1.0.5 dengan cara

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script>

Dalam dokumentasi ngClass , contohnya sederhana, tetapi juga menyebutkan ekspresi dapat berupa peta nama kelas ke nilai boolean. Saya mencoba menggunakan gaya "ikon-putih" pada ikon saya seperti yang ditunjukkan dalam dokumentasi bootstrap , tergantung pada variabel boolean.

<i class="icon-home" ng-class="{icon-white: someBooleanValue}">

Baris di atas tidak berfungsi. Kelas tidak ditambahkan icon-whitekapan someBooleanValuebenar. Namun, jika saya mengubah kunci iconWhite, berhasil ditambahkan ke daftar nilai kelas. Bagaimana cara menambahkan nilai dengan tanda hubung?

Setelah berjam-jam meretas, ternyata tanda hubung diinterpolasi! Diperlukan kutipan.

<i class="icon-home" ng-class="{'icon-white': someBooleanValue}">

Saya harap ini membantu seseorang merobek rambut mereka.

MEMPERBARUI:

Di versi Angular yang lebih lama, menggunakan backslash juga berfungsi, tetapi tidak di versi yang lebih baru.

<i class="icon-home" ng-class="{icon\-white: someBooleanValue}">

Yang pertama mungkin lebih disukai, karena Anda dapat lebih mudah mencarinya di editor favorit Anda.

\'icon-white\' berfungsi juga (dengan AngularJS 1.2.7)

alternatif untuk penggunaan ng-class:

    .menu-disabled-true{
color: red;
}
    .menu-disabled-false{
color: green;
}


<div ng-controller="DeathrayMenuController">
<p class=menu-disabled-{{status}}>shanam</p>
 <button ng-click="action()">click me</button>
</div>

<script>



function DeathrayMenuController($scope) {
    $scope.status=true
    $scope.action= function(){
      $scope.status=!$scope.status
    }
}
</script>