CODEWITHSUNDEEP
angularjsdependency-injectionangular-ui-bootstrapangular-ui
Mawg
Mawg

Reputation: 40155

Can't inject UI Bootstrap

I have off the shelf app framework. Index.html contains this 

<!-- jQuery and Bootstrap -->
<script src="js/jquery/jquery-2.1.1.min.js"></script>
<script src="js/plugins/jquery-ui/jquery-ui.js"></script>
<script src="js/bootstrap/bootstrap.min.js"></script>

<!-- MetsiMenu -->
<script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>

<!-- SlimScroll -->
<script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

<!-- Peace JS -->
<script src="js/plugins/pace/pace.min.js"></script>

<!-- Custom and plugin javascript -->
<script src="js/inspinia.js"></script>

<!-- Main Angular scripts-->
<script src="js/angular/angular.min.js"></script>
<script src="js/plugins/oclazyload/dist/ocLazyLoad.min.js"></script>
<script src="js/ui-router/angular-ui-router.min.js"></script>
<script src="js/bootstrap/ui-bootstrap-tpls-0.12.0.min.js"></script>

<!-- Our application's scripts -->
<script src="js/controllers.js"></script>

and in js/controllers.js, I have 

angular
    .module('inspinia')
    .controller('MainCtrl', MainCtrl)

and my controller is

function MainCtrl($scope, $http, $interval, $state, $location)

when I try to inject UI bootstrap by chaning it to

.module('inspinia', ['ui.bootstrap'])

I get

"Error: [$injector:unpr] http://errors.angularjs.org/1.3.7/$injector/unpr?p0=%24stateProvider%20%3C-%20%24state%20%3C-%20MainCtrl

I am sure that it is something very simple, but I can't see what.

Upvotes: 0

Views: 1097

Answers (1)

Pankaj Parkar
Pankaj Parkar

Reputation: 136184

Seems like you are using $state API service inside your controller so you also need to also include ui.router with it.

So while asking for $state dependency, injector doesn't able to find asked dependency inside angular DI container $injector/unpr?p0=%24stateProvider in MainCtrl

angular
  .module('inspinia', ['ui.bootstrap', 'ui.router'])

Upvotes: 2

Related Questions