I can't instantiate my app when I try to inject 'ngAnimate' like so:

var app = angular.module('musicsa', [
  'ngCookies',
  'ngResource',
  'ngSanitize',
  'ui.router',
  'firebase',
  'ngAnimate'
]) 

I get an error Uncaught object from angular.js line 78

I installed ngAnimate using bower. Here's my bower.json:

{
  "name": "ang-changeorg",
  "version": "0.0.0",
  "dependencies": {
    "angular": "1.2.6",
    "json3": "~3.2.6",
    "es5-shim": "~2.1.0",
    "jquery": "~1.10.2",
    "bootstrap": "~3.0.3",
    "angular-resource": "1.2.6",
    "angular-cookies": "1.2.6",
    "angular-sanitize": "1.2.6",
    "firebase": "~1.0.11",
    "angularfire": "~0.7.1",
    "spin.js": "~2.0.0",
    "angular-ui-router": "~0.2.10",
    "angular-animate": "~1.2.16"
  },
  "devDependencies": {
    "angular-mocks": "1.2.6",
    "angular-scenario": "1.2.6"
  },
  "resolutions": {
    "angular": "1.2.6"
  }
}

And I include all the scripts in my index.html:

<script src="bower_ponents/jquery/jquery.js"></script>
<script src="bower_ponents/angular/angular.js"></script>
<script src="bower_ponents/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_ponents/angular-resource/angular-resource.js"></script>
<script src="bower_ponents/angular-cookies/angular-cookies.js"></script>
<script src="bower_ponents/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_ponents/firebase/firebase.js"></script>
<script src="bower_ponents/firebase-simple-login/firebase-simple-login.js"></script>
<script src="bower_ponents/angularfire/angularfire.js"></script>
<script src="bower_ponents/spin.js/spin.js"></script>
<script src="bower_ponents/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_ponents/angular-animate/angular-animate.js"></script>

If I remove 'ngAnimate' from my module declaration everything works. Why can't I use ngAnimate?

I can't instantiate my app when I try to inject 'ngAnimate' like so:

var app = angular.module('musicsa', [
  'ngCookies',
  'ngResource',
  'ngSanitize',
  'ui.router',
  'firebase',
  'ngAnimate'
]) 

I get an error Uncaught object from angular.js line 78

I installed ngAnimate using bower. Here's my bower.json:

{
  "name": "ang-changeorg",
  "version": "0.0.0",
  "dependencies": {
    "angular": "1.2.6",
    "json3": "~3.2.6",
    "es5-shim": "~2.1.0",
    "jquery": "~1.10.2",
    "bootstrap": "~3.0.3",
    "angular-resource": "1.2.6",
    "angular-cookies": "1.2.6",
    "angular-sanitize": "1.2.6",
    "firebase": "~1.0.11",
    "angularfire": "~0.7.1",
    "spin.js": "~2.0.0",
    "angular-ui-router": "~0.2.10",
    "angular-animate": "~1.2.16"
  },
  "devDependencies": {
    "angular-mocks": "1.2.6",
    "angular-scenario": "1.2.6"
  },
  "resolutions": {
    "angular": "1.2.6"
  }
}

And I include all the scripts in my index.html:

<script src="bower_ponents/jquery/jquery.js"></script>
<script src="bower_ponents/angular/angular.js"></script>
<script src="bower_ponents/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_ponents/angular-resource/angular-resource.js"></script>
<script src="bower_ponents/angular-cookies/angular-cookies.js"></script>
<script src="bower_ponents/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_ponents/firebase/firebase.js"></script>
<script src="bower_ponents/firebase-simple-login/firebase-simple-login.js"></script>
<script src="bower_ponents/angularfire/angularfire.js"></script>
<script src="bower_ponents/spin.js/spin.js"></script>
<script src="bower_ponents/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_ponents/angular-animate/angular-animate.js"></script>

If I remove 'ngAnimate' from my module declaration everything works. Why can't I use ngAnimate?

• javascript
• angularjs
• angular-ui
• bower
• ng-animate

• did you run a bower install after updating your bower.json and check that the angular-animate.js file has been loaded? – shaunhusain Commented Jun 5, 2014 at 16:12
• yeah it's was all loading. I think it's something to do with the angular versioning – Connor Leech Commented Jun 5, 2014 at 16:18
• 1 Yes, my guess after reading was the problem has to do with you using Angular 1.2.6 and ngAnimate 1.2.16. – Marc Kline Commented Jun 5, 2014 at 16:29

2 Answers 2

Ran into the same problem. You have to match the version of angular to angular animate.

change:

"angular-animate": "1.2.6"

I ran into a similar situation.

If you are using karma you need to manually enter the path to angular-animate under vendor_files.js in your build.config.js (grunt task) that solves the loading dependency.

After adding I got another error which was solved by declaring it last in vendor_files.js