ダッシュをキーにしたngClassスタイル

Question

これは、特にブートストラップが普及して以来、ダッシュを使用するスタイルで頭痛を軽減することを願っています。私はngClass documentationで

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

の方法によって角度1.0.5を使用しています

、例は単純ですが、それはまた、式はブール値にクラス名のマップすることができ言及しています。私は、ブール変数に応じて、bootstrap documentationに示すように、アイコン上に「アイコン白」のスタイルを使用しようとしていました。

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

上記の行は機能しません。 someBooleanValueがtrueの場合、クラスにはicon-whiteが追加されません。ただし、キーをiconWhiteに変更すると、クラス値のリストに正常に追加されます。どのようにダッシュで値を追加するのですか？

Answer 1

ハッキングの時間がたってから、ダッシュが補間されていることが判明しました！引用が必要です。

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

私はこれが誰かが自分の髪を引き裂くのを助けることを望みます。

UPDATE：角の古いバージョンでは

、バックスラッシュを使用しても、トリックを行いますが、ないより新しいバージョンインチ

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

あなたが好きなエディタで簡単に検索できるので、前者がおすすめです。

Answer 2

\'icon-white\'は用途NG-クラスの

Answer 3

代替（AngularJS 1.2.7と）同様に動作します

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