Question

我正在尝试动画将新列表项插入列表的过程。

按照http://www.nganimate.org/

上的说明操作

第1步：我建立基类

.animate-enter {
  -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    transition:  400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
      opacity: 0;   
}

第2步：建立最终状态的课程

.animate-enter.animate-enter-active {
    opacity: 1;
}

然而，这似乎并没有为任何动画制作动画。

Plnkr：

http://plnkr.co/edit/lpMdhRpQjf5QlNtfb5dn?p=preview

Answer 1

问题在于ng-animate内置于1.1.5中，但不是您使用的版本，即1.3。如果您使用脚本标记（例如//code.angularjs.org/X.Y.Z/angular-animate.js）在此版本中使用ngAnimate，则必须下载或引用ngAnimate作为单独的模块。 See Here

但是here's使用角度1.1.5代码的一个plunker，我添加了一个搜索过滤器来更好地显示动画。在您定义动画类后，我相信您也错过了一个括号。

此外，您在transtition中的不透明度在函数之前的css中没有前缀，而在函数之后也没有all。但这似乎是一个错字：

.animate-enter {
  -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) opacity ;
  -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) opacity ;
  -ms-transition 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) opacity ;
  -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) opacity ;
  transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) opacity ;
    opacity: 0;
}

Answer 2

除了将angular-animate.js脚本包含到页面中之外，您还需要按如下方式注入ngAnimate：

#!/usr/bin/python

import thread
import time

# Define a function for the thread
def print_time( threadName, delay):
   count = 0
   while count < 5:
      time.sleep(delay)
      count += 1
      print "%s: %s" % ( threadName, time.ctime(time.time()) )

# Create two threads as follows
try:
   thread.start_new_thread( print_time, ("Thread-1", 2, ) )
   thread.start_new_thread( print_time, ("Thread-2", 4, ) )
except:
   print "Error: unable to start thread"

ng-animate无法正常工作

2 个答案: