I´m trying to use the ui-bootstrap Typeahead directive in my Angular app. According to the installation instructions looks pretty simple, however I got this error in my browser console:
Uncaught Error: No module: ui-bootstrap
I have added the template script to my index.html, like this:
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-resource.js"></script>
<script src="js/ui-bootstrap-tpls-0.6.0.min.js"></script>
<script src="lib/bootstrap/bootstrap.js"></script>
<script src="lib/bootstrap/bootstrap-datepicker.js"></script>
<script src="lib/bootstrap/bootstrap-select.js"></script>
<script src="js/app.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
And I have added the ui-bootstrap directive to my app.js file like this:
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'myApp.controllers', 'ui-bootstrap']).
config(['$routeProvider', '$httpProvider', function($routeProvider, $httpProvider) {
$routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: 'MyCtrl1'});
$routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: 'MyCtrl2'});
$routeProvider.when('/home', {templateUrl: 'partials/home.html', controller: 'BoatListCtrl'});
$routeProvider.when('/contact', {templateUrl: 'partials/contact.html', controller: 'BoatListCtrl'});
$routeProvider.otherwise({redirectTo: '/home'});
delete $httpProvider.defaults.headers.common["X-Requested-With"];
}]);
Any suggestion?
I knew was something stupid.
In my app.js it is 'ui.bootstrap' instead of 'ui-bootstrap' (check the -).