Question

我是angularjs的新手，我正在尝试在屏幕之间实现滑动导航。我的意思是，滑动/滑动屏幕转到下一页。我跟着这个链接 http://weblogs.asp.net/dwahlin/archive/2013/08/18/angularjs-animations-in-version-1-2.aspx 实现这一点，但它似乎对我不起作用。

<div class="container">
        <ng-view class="slide-animation"></ng-view></div>
        </div>

我添加了css文件中链接中给出的css

slide-animation.ng-enter, .slide-animation.ng-leave {
  -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
  -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
  -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;

  position:absolute;
  top:0;
  left:0;
  right:0;
  min-height:1000px;
}

.slide-animation.ng-enter {
  opacity:0;
  left:100px;
}

.slide-animation.ng-enter.ng-enter-active {
  left:0;
  opacity:1;
}

.slide-animation.ng-leave {
  left:0;
  opacity:1;
}

.slide-animation.ng-leave.ng-leave-active {
  left:-100px;
  opacity:0;
}

但我无法滑动我的观点。我没有添加'ngAnimate'指令。这是获取幻灯片导航视图的正确方法。

Answer 1

您没有展示您的模块创建，但您需要将ngAnimate作为子模块（位于单独的js文件中 - angular-animate.js）中包含：

var app = angular.module('app', ['ngRoute', 'ngAnimate']);

用于导航angularjs的幻灯片动画

1 个答案: