实例化ngAnimate模块失败,原因是:
Failed to instantiate module ngAnimate due to:
我在构建Angular JS项目时遇到了一些问题。
实例化ngAnimate模块失败,原因:
我已经把我所有的服务放入[],但ngAnimate不工作。
应用程序
由于:'use strict',实例化ngAnimate模块失败
/* global app:true */
var app = angular
.module('angNewsApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ngRoute',
'ngAnimate',
'firebase'
])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/posts.html',
controller: 'PostsCtrl'
})
.when('/posts/:postId', {
templateUrl: 'views/showpost.html',
controller: 'ViewPostCtrl'
})
.otherwise({
redirectTo: '/'
});
}])
.constant('FIREBASE_URL', 'https://scorching-fire-4068.firebaseio.com/');
app.directive('post', function() {
var controller = function($scope) {
$scope.showAnswer = false;
};
return {
restrict: 'C',
scope: false,
controller: controller
};
});
app.animation('.answer-animation', function(){
CSSPlugin.defaultTransformPerspective = 1000;
TweenMax.set($("div.back"), {rotationX:-180});
$.each($("div.box"), function(i,element)
{
console.log(element);
var frontCard = $(this).children("div.front")
var backCard = $(this).children("div.back")
var tl = new TimelineMax({paused:true})
tl
.to(frontCard, 1, {rotationX:180})
.to(backCard, 1, {rotationX:0},0)
this.animation = tl;
});
return {
beforeAddClass: function(element, className, done){
if (className == 'answer') {
var el = element.find('.box')[0];
el.animation.play();
}
else {
done();
}
},
beforeRemoveClass: function(element, className, done) {
if (className == 'answer') {
var el = element.find('.box')[0];
el.animation.reverse();
}
else {
done();
}
}
};
});
和index.html脚本标签
<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/firebase/firebase.js"></script>
<script src="bower_components/firebase-simple-login/firebase-simple-login.js"></script>
<script src="bower_components/angularfire/angularfire.js"></script>
<!-- endbower -->
<!-- endbuild -->
<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-animate.js"></script>
<script src="scripts/app.js"></script>
<script src='scripts/services/posts.js'></script>
<script src="scripts/filters/url.js"></script>
<script src="scripts/controllers/posts.js"></script>
<script src="scripts/controllers/postview.js"></script>
<script src="scripts/controllers/nav.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.7/TweenMax.min.js"></script>
<!-- endbuild -->
这就是答案,
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-animate.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.7/TweenMax.min.js"></script>
都是外部库加载,这意味着它们不能进行最小化过程。
我解决了这个问题,通过安装库通过bower,并添加他们像它。
<script src="/bower_components/angular-animate/angular-animate.js"></script>
<script src="/bower_components/greensock/src/minified/TweenMax.min.js"></script>
只是添加这个,以防它帮助别人!
我有同样的问题,但我的原因是,我有src在脚本标签角动画不正确-我粘贴的bower_components/angular/angular- animation .js不是正确的引用,这是:
<script src="bower_components/angular-animate/angular-animate.js"></script>
相关文章:
- Javascript,访问一个主要对象模块模式中的每个对象
- 节点Js:How to catch a“;没有这样的文件或目录“;读取线模块出错
- 如何从模块链中调用函数.导出到节点中
- 尽管链接成功并已成功下载,但未找到NPM模块
- 节点是否需要模块传递带有方括号的arg?这是个错误吗
- 从模块内部访问Express装载路径
- RequireJS向模块传递配置总是返回undefined
- Node.js正在更改应用程序以使用集群模块
- 在Meteor项目中安装并包含npm模块后出错
- 模块模式和这个
- 将依赖外部库的UMD模块与browserfy捆绑在一起
- 找不到模块捆绑包
- JavaScript命名约定;静态“;类或模块
- 显示模块模式在Knockout中设置模型的新实例
- 有没有比在app.js上绑定模块名称更好的方法来动态加载视图模型和视图以显示模态
- Javascript模块系统I'I’我正在努力,但搞不明白
- 将ngAnimate包含为依赖模块时出错
- 在模块上添加ngAnimate依赖项
- Angular:淡入/淡出,不包括模块NgAnimate
- 实例化ngAnimate模块失败,原因是: