javascript - ngAnimate 没有将 ng-enter 类添加到 Angular 1.2 中的 ng-view

Question

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

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

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

Answer 1

只需为每个浏览器添加每个 vendor 的前缀，例如chrome 的 -webkit 在你的 css 文件中

FORKED PLUNKER

.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); }
}