สไตล์ ngClass พร้อมกับประในคีย์

ฉันหวังว่านี่จะช่วยให้ใครบางคนปวดหัวด้วยสไตล์ที่ใช้เครื่องหมายขีดคั่นโดยเฉพาะอย่างยิ่งเมื่อ bootstrap ได้รับความนิยม

ฉันใช้มุมฉาก 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}">

ฉันหวังว่านี่จะช่วยให้ใครบางคนหลุดจากเส้นผมของพวกเขา

UPDATE:

ในเวอร์ชันเก่าของ Angular การใช้แบ็กสแลชนั้นเป็นการหลอกลวง แต่ไม่ใช่ในเวอร์ชันที่ใหม่กว่า

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

อาจเป็นที่นิยมมากกว่าเนื่องจากคุณสามารถค้นหาได้ง่ายขึ้นในเครื่องมือแก้ไขรายการโปรดของคุณ

\'icon-white\' ทำงานได้ดี (ด้วย AngularJS 1.2.7)

ทางเลือกสำหรับการใช้งาน 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>