Espero que isso poupe a alguém uma dor de cabeça com estilos que usam traços, especialmente desde que o bootstrap se tornou tão popular.
Estou usando o angular 1.0.5 por meio de
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script>
Na documentação do ngClass , o exemplo é simples, mas também menciona que a expressão pode ser um mapa de nomes de classes para valores booleanos. Eu estava tentando usar o estilo "icon-white" no meu ícone, como mostrado na documentação do bootstrap , dependendo de uma variável booleana.
<i class="icon-home" ng-class="{icon-white: someBooleanValue}">
A linha acima não funciona. A classe não é anexada com icon-white
quando someBooleanValue
é verdadeira. No entanto, se eu alterar a chave para iconWhite
, ela será adicionada com êxito à lista de valores de classe. Como alguém adicionaria um valor com um traço?
Respostas:
Após horas de hackers, o traço fica interpolado! Citações são necessárias.
Espero que isso ajude alguém a arrancar os cabelos.
ATUALIZAR:
Nas versões mais antigas do Angular, o uso de uma barra invertida também funciona, mas não nas versões mais recentes.
O primeiro é provavelmente o preferido, pois você pode pesquisá-lo com mais facilidade no seu editor favorito.
fonte
\'icon-white\'
também funciona (com AngularJS 1.2.7)fonte
alternativa para usos da classe ng:
fonte