Question

我无法获得仅适用于ng-show的动画。

这可以淡出淡出：

        .animate-show {
            display: block !important;
            -webkit-transition:all linear 1.5s;
            transition:all linear 1.5s;
        }

        .animate-show.ng-hide {
            opacity:0;
        }

    <div ng-show="match.userId" style="margin-right: auto; margin-left: auto;" class="padding animate-show ng-hide">
      ...
    </div>

我只想淡入IN ......没有动画隐藏。这不起作用

       .animate-show {
            display: block !important;
        }

        .animate-show.ng-hide-remove.ng-hide-remove-active {
            -webkit-transition:all linear 1.5s;
            transition:all linear 1.5s;
        }

        .animate-show.ng-hide {
            opacity:0;
        }

这是一个傻瓜：

http://plnkr.co/edit/9KNqt5TAZ8Ejy8eeJUQs

Answer 1

.animate-show.ng-hide-remove.ng-hide-remove-active {

ng-hide-remove-active为时已晚，您只需要ng-hide-remove。

Working plunker

AngularJS CSS动画不起作用

1 个答案: