gambler
gambler

Reputation: 67

Uncaught Error: [$injector:modulerr] in angular js

I am getting error Uncaught Error: [$injector:modulerr]

I have included below js files

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>
    <script src="lib/jquery-1.12.1.min.js"></script>

and my js code is

angular.module('website',['ngRoute','ngResource']).
     config(function($routerProvider){
        $routerProvider.
            when('/about',{template:'templates/about.html'}),
            when('/careers',{template:'templates/careers.html'}),
            when('/signup',{template:'templates/signup.html'}),
            otherwise({redirectTo : '/home', template:'/home.html'})
    })

function mainController($scope){

}

Somebody please help me, where i am missing.

EDITED: Error log is Failed to instantiate module website due to: Error: [$injector:unpr] http://errors.angularjs.org/1.4.5/$injector/unpr?p0=%24ro... at Error (native) at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:6:416 at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:40:307 at d (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:38:308) at Object.e [as invoke] (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:39:64) at d (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:37:279) at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:37:403 at n (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:7:322) at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:37:180) at eb (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js:40:435

Upvotes: 2

Views: 4171

Answers (1)

Khalid Hussain
Khalid Hussain

Reputation: 1694

Working Plnkr

Change $routerProvider to $routeProvider. Replace , with . in config. For example:

when('/about',{template:'templates/about.html'}),
when('/careers',{template:'templates/careers.html'})

to

when('/about',{template:'templates/about.html'})
.when('/careers',{template:'templates/careers.html'})

Your JavaScript code should look like this:

var website = angular.module('website',['ngRoute','ngResource']);

     website.config(function($routeProvider){
        $routeProvider.
            when('/about',{template:'templates/about.html'})
            .when('/careers',{template:'templates/careers.html'})
            .when('/signup',{template:'templates/signup.html'})
            .otherwise({redirectTo : '/home', template:'/home.html'})
    }) 

website.controller('mainController', function($scope){

});

For more information, please have a look at this example.

Hope that solve your problem.

Upvotes: 3

Related Questions