Question

我尝试使用控制器中包含的ng-animate app = angular.module（'Packs'，['ngAnimate']）; 这是我的风格：

<style>
    .animate-in {
        opacity: 0;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        transition: all 0.5s;
    }
    .animate-out{
        opacity: 1;
        max-height: 200px;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        transition: all 0.5s;
    }
</style>

这是html无效，嗯，它确实有效，只是我必须手动切换类，我想使用ng-animate

<div ng-click="toggle('pack1')">
    <div class="text" 
        ng-class="{'animate-in' : !displays.pack1,
               'animate-out' : displays.pack1}">
                            Some text to toggle
    </div>
</div>

Answer 1

是的，在您的文字上使用ng-show = "displays.pack1"，然后使用特殊课程ng-hide / ng-hide-active，参见示例in the documentation

这是一个显示不透明度和高度的切换的jsfiddle：http://jsfiddle.net/1djeqjfm/1/

.box.ng-hide { opacity:0; }
.box.ng-hide-active { opacity:1; }

（或使用ng-if及其类ng-enter / ng-leave）

是否有角度动画方式来模拟这种ng-class行为

1 个答案: