Стиль ngClass з тире в ключі

Я сподіваюся, що це вбереже когось від головного болю зі стилями, які використовують тире, тим більше, що завантажувальний набір став таким популярним.

Я використовую кутовий 1.0.5

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

У документації ngClass приклад простий, але він також згадує, що вираз може бути картою назв класів до булевих значень. Я намагався використовувати стиль "білий-білий" на моєму значку, як показано в документації на завантаження , залежно від булевої змінної.

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

Рядок вище не працює. Клас не додається, icon-whiteколи someBooleanValueце правда. Однак якщо я змінити ключ iconWhite, він успішно додається до списку значень класу. Як можна додати значення з тире?

Після годинного злому навколо, виявляється, тире стає інтерпольованим! Цитати потрібні.

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

Я сподіваюся, що це допоможе комусь зірвати волосся.

ОНОВЛЕННЯ:

У старих версіях Angular використання зворотної косої риски також робить хитрість, але не в нових версіях.

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

Перший, мабуть, кращий, оскільки ви можете легше шукати його в улюбленому редакторі.

\'icon-white\' працює також (з AngularJS 1.2.7)

альтернатива для використання ng-класу:

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