Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Error: [$injector:unpr] Unknown provider: $routeProvider

Tags:

angularjs

I am trying to get an AngularJS 1.2 RC2 app up and running. Currently, I've been using the Angular Seed project to try and get my app up and running. Unfortunately, the Angular Seed project uses v1.0.7. From the Angular Seed project, I've updated the dependencies to be the following:

$script([
  'res/js/angular-1.2.0-rc.2.js',
  'res/js/angular-route-1.2.0-rc.2.js',
  'res/js/app.js?v=2',
], function() {
  // when all is done, execute bootstrap angular application
  angular.bootstrap(document, ['myApp']);
});

In app.js, I have the following:

'use strict';

angular.module('myApp', []).
    config(['$routeProvider', function($routeProvider) {
        $routeProvider.otherwise({redirectTo: '/home'});
    }]);

When I run this app, I get the following error:

Error: [$injector:unpr] Unknown provider: $routeProvider

I've read some of the other responses that say things like 1) Inject 'ngroute' or 2) You need to define the controller in the route. My problem is, I don't understand how to inject ngroute. In addition, do I really need to define the controller in the route? That approach doesn't seem scalable. My app may have a thousand views. In my opinion, it just seems like there has to be way to define routes without having to load all of the controllers.

like image 987
user70192 Avatar asked Oct 05 '13 11:10

user70192


2 Answers

It looks like you forgot to include the ngRoute module in your dependency for myApp.

In Angular 1.2, they've made ngRoute optional (so you can use third-party route providers, etc.) and you have to explicitly depend on it in modules, along with including the separate file.

'use strict';

angular.module('myApp', ['ngRoute']).
    config(['$routeProvider', function($routeProvider) {
$routeProvider.otherwise({redirectTo: '/home'});
}]);
like image 185
Cuong Vo Avatar answered Nov 08 '22 11:11

Cuong Vo


In angular 1.4 +, in addition to adding the dependency

angular.module('myApp', ['ngRoute'])

,we also need to reference the separate angular-route.js file

<script src="angular.js">
<script src="angular-route.js">

see https://docs.angularjs.org/api/ngRoute

like image 36
Daniel de Zwaan Avatar answered Nov 08 '22 13:11

Daniel de Zwaan