ngAnimate没有在Angular 1.2的ng-view中添加ng-enter类

ngAnimate not adding ng-enter class to ng-view in Angular 1.2

本文关键字：ng-view 添加 ng-enter Angular ngAnimate      更新时间：2023-09-26

我一直在网上寻找这个问题的答案，但我似乎找不到任何明确的答案。

问题似乎是ngAnimate指令不添加类ng-enter或ng-leave时，路由的变化。我已经创建了一个测试应用程序，并将ngAnimate指令包含到应用程序中。我还创建了动画类，并将该类应用于ng-view元素

测试应用程序的链接在这里:http://plnkr.co/edit/6qCMeIkWeXeTQyDWcu29?p=preview

只需在css文件中添加每个浏览器的每个供应商前缀，例如chrome的-webkit

叉形恰好 

.slide.ng-enter, .slide.ng-leave{
  position: absolute;
}
.slide.ng-enter { 
  animation: slideInRight 0.5s both ease-in; z-index: 8888; 
  -webkit-animation: slideInRight 0.5s both ease-in; z-index: 8888; 
}
.slide.ng-leave { 
  animation: slideOutLeft 0.5s both ease-in; z-index: 9999; 
  -webkit-animation: slideOutLeft 0.5s both ease-in; z-index: 9999; 
}

@keyframes slideOutLeft {
    to      { transform: translateX(-100%); }
}
@-webkit-keyframes slideOutLeft {
    to      { transform: translateX(-100%); }
}

@keyframes slideInRight {
    from    { transform: translateX(100%); }
    to      { transform: translateX(0); }
}
@-webkit-keyframes slideInRight {
    from    { transform: translateX(100%); }
    to      { transform: translateX(0); }
}
相关文章：