使用 ng-class angular js 自定义

Question

我有两个 css classes.caret .right 和 .caret .down 这是我的代码

<span> ng-class="{'caret right': checkboxer[mainParent]==true,'caret down': checkboxer[mainParent]==false}" </span>

和我的css

.caret .right{transform: rotate(270deg);}.caret .down{transform:rotate(360deg);}

插入符号 class 来自 bootstrap。它不会影响我的跨度吗？我犯了什么错误？

Answer 1

如果 checkboxer[mainParent] returns 是一个布尔值，那么这就是解决方案。

<span class="caret" ng-class="{
        'right': checkboxer[mainParent],
        'down': !checkboxer[mainParent]
    }">

</span>

Answer 2

这是工作原理。

  <div ng-click="toggle()">
    <span ng-class="{'right-caret':checkbox,'caret': !checkbox}"></span> Caret
  </div>

另一种更简单的方法

class="caret {{checkboxer[mainParent] ? 'right' : 'down'}}"

Customize using ng-class angular js