Angular UI Bootstrap - Carousel directive - Animate CSS Provider unknown

Question

I'm trying to use the carousel directive, and am getting two errors.

First error:

Unknown provider: $animateCssProvider <- $animateCss <- .item-animation 

Second error:

TypeError: $animate.on is not a function 

package.json:

"bootstrap": "*", "angular": ">=1.4.0", "grunt-angular-templates": "1.0.4", "angular-animate": "1.4.0", "angular-translate": "^2.7.0", "angular-ui-bootstrap": "^1.2.4", "checklist-model": "*", "numeral": "*", "angular-numeraljs": "^1.0" 

controller:

var estateCarouselController = presentation.controller('estateCarouselController',['$scope',function($scope){ $scope.myInterval = 3000; $scope.noWrapSlides = false; $scope.active = 0; $scope.slides = [ { image: 'http://lorempixel.com/400/200/' }, { image: 'http://lorempixel.com/400/200/food' }, { image: 'http://lorempixel.com/400/200/sports' }, { image: 'http://lorempixel.com/400/200/people' } ]; } 

markup:

<uib-carousel active="0" interval="myInterval"> <uib-slide ng-repeat="slide in slides" index="$index"> <img ng-src="{[{slide.image}]}" style="margin:auto;" /> <div class="carousel-caption"> <h4>Slide {[{$index+1}]}</h4> </div> </uib-slide> </uib-carousel> 

NOTE: Delimiter is to avoid conflict with Twig.

EDIT: Module declaration.

var presentation = angular.module('presentation', ['ngNumeraljs','apiModule',"checklist-model",'ngAnimate',"ui.bootstrap"]);