能否请您看一下代码片段并告诉我为什么动画不起作用，例如不透明度变化和背景颜色没有变化。请注意，代码完全取自一本书，所以我真的很困惑它为什么不能工作。
请注意 css 文件，angular-animate 包含在 html 中
<link rel="stylesheet" href="css/simple.css"/>
<script src="lib/angular/angular-animate.js"></script>
html正文:
<body>
<div ng-init="isShown=true">
<input type="checkbox" ng-model="isShown" />Show
<div ng-class="my-animation-class" ng-if="isShown">
<h3>Enter/Leave Animation</h3>
</div>
</div>
</body>
CSS 代码:
.my-animation-class.ng-enter {
-webkit-transition: 0.5s linear all;
-o-transition: 0.5s linear all;
-moz-transition: 0.5s linear all;
opacity: 0;
background: green;
}
.my-animation-class.ng-enter.ng-enter-active {
opacity: 1;
}
另请注意，ngAnimate 作为依赖项存在于 app.js 中
求助!预先谢谢你!如果有任何问题，请告诉我。
最佳答案
你的问题是你正在使用 ng-class 并将 my-animation-class 作为范围变量传递，要解决这个问题你应该使用
<div ng-class="'my-animation-class'" ng-if="isShown">
甚至
<div class="my-animation-class" ng-if="isShown">
这样，您的 div 将具有类并且动画将运行。
希望它能解决您的问题。
关于javascript - 过渡动画在 Angular 中不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34990002/