Angular .ng-hide-remove动画不起作用

Angular .ng-hide-remove animation doesn't work

本文关键字：不起作用 动画 ng-hide-remove Angular      更新时间：2023-09-26

我有这样的CSS: 

#platinumHeader.ng-hide-remove  {
-webkit-animation: fadeInDown 0.5s!important;
-moz-animation: fadeInDown 0.5s!important;
-o-animation: fadeInDown 0.5s!important;
animation: fadeInDown 0.5s!important;
}

这个html:

<header class="navbar-fixed-top header-floating" data-ng-show="isHeader" id="platinumHeader">
        <div class="container">
          ...
        </div>
    </header>

但是当我的头显示(即isHeader设置为true)，它只是出现没有动画。

但是如果我像这样写CSS(不带#platinumHeader选择器):

.ng-hide-remove  {
-webkit-animation: fadeInDown 0.5s!important;
-moz-animation: fadeInDown 0.5s!important;
-o-animation: fadeInDown 0.5s!important;
animation: fadeInDown 0.5s!important;
}

很好。我哪里做错了?

尝试使用ngClass指令

<header class="navbar-fixed-top header-floating" ng-class="{'ng-hide-remove' : isHeader}" data-ng-show="isHeader" id="platinumHeader">
        <div class="container">
        </div>
</header>
相关文章：