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

Я надеюсь, что это избавит кого-то от головной боли от стилей, которые используют тире, тем более, что начальная загрузка стала настолько популярной.

Я использую угловой 1.0.5 в виде

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

В документации по ngClass пример прост, но в нем также упоминается, что выражение может представлять собой карту имен классов с логическими значениями. Я пытался использовать стиль «icon-white» на своем значке, как показано в документации по начальной загрузке , в зависимости от логической переменной.

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

альтернатива для использования нг-класса:

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