Javascript 为什么我的ng类忽略了动画？

我试图使用ng类根据特定条件设置图标的颜色，但是我也有一个类包装它所在的div，使其淡入

由于某些原因，动画被忽略，只显示彩色图标

    <div class="change-container" >
        <i data-ng-class="{color: 'green'}"></i>
    </div>

.change-container {
    display: inline-block;
    padding: 0 15px 0 15px;
    height: 100px;
    text-align: center;
    -moz-animation: change-widget-fade-in 0.7s ease-in 1;
    -o-animation: change-widget-fade-in 0.7s ease-in 1;
    -webkit-animation: change-widget-fade-in 0.7s ease-in 1;
}

.换集装箱{
显示：内联块；
填充：0 15px 0 15px；
高度：100px；
文本对齐：居中；
-moz动画：改变小部件淡入淡出0.7秒轻松1；
-o-动画：在0.7s内更改小部件淡入淡出1；
-webkit动画：改变小部件淡入淡出0.7秒轻松1；
}

您缺少

ng类的语法。不能使用
ng class
直接添加样式。
ng类
的正确语法为

<ANY
  ng-class="expression">
...
</ANY>

然后您可以使用

<div class="change-container" >
    <i data-ng-class="{'green-color': true}"></i>
</div>



您可以使用布尔表达式代替
true
来有条件地添加
绿色
类

<div class="change-container" >
    <i data-ng-class="{'green-color': true}"></i>
</div>