Angular js injection error

Question

I'm trying my luck with angular and can't seem to find the source of this error.

Error: [$injector:modulerr] http://errors.angularjs.org/1.2.21/$injector/modulerr?p0=NoNameApp&p1=%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.2.21%2F%24injector%2Fnomod%3Fp0%3DNoNameApp%0Ay%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A6%3A443%0AZc%2Fb.module%3C%2F%3C%2Fb%5Be%5D%3C%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A20%3A385%0AZc%2Fb.module%3C%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A20%3A273%0Ae%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A33%3A206%0Aq%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A7%3A288%0Ae%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A33%3A148%0Agc%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A36%3A250%0Afc%2Fc%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A18%3A58%0Afc%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A18%3A270%0AXc%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A17%3A369%0A%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fangular%2Fangular.min.js%3A213%3A58%0An.Callbacks%2Fj%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A26852%0An.Callbacks%2Fk.fireWith%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A27661%0A.ready%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A29482%0AI%40http%3A%2F%2Flocalhost%3A8080%2FLectureWeb%2Fscript%2Fbower_components%2Fjquery%2Fdist%2Fjquery.min.js%3A2%3A29656%0A angular.min.js:6

angular.module("NoNameApp",['ngRoute','ngSanitize'])

.config(['$routeProvider',function($routeProvider){

    $routeProvider.

    when('/home',{templateUrl:'views/partials/home.html'}).
    otherwise({redirectTo: '/', templateUrl: 'views/partials/home.html'});


}])


.controller('MainController',['$rootScope','$scope','$location',function($rootScope,$scope,$location){

    rootScope.dataForAllPages = {};
    rootScope.globalFunctions = {};



    dataForAllPages.status = "";
    dataForAllPages.notifications = "";

    globalFunctions.changeRoute = function(path){
        $location.path(path);

    };

}]);

//,'mgcrea.ngStrap.modal', 'mgcrea.ngStrap.aside', 'mgcrea.ngStrap.tooltip'






   <!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<html>
    <head>
        <title>AngularPlayground</title>






        <!-- CSS -->


        <link rel="stylesheet" href="<c:url value="script/bower_components/angular/angular-csp.css" />">
        <link rel="stylesheet" href="<c:url value="script/bower_components/angular-motion/dist/angular-motion.min.css" />">
        <link rel="stylesheet" href="<c:url value="script/bower_components/bootstrap/dist/css/bootstrap-theme.min.css" />">
        <link rel="stylesheet" href="<c:url value="script/bower_components/bootstrap/dist/css/bootstrap.min.css" />">
        <link rel="stylesheet" href="<c:url value="script/bower_components/ng-table/ng-table.min.css" />">









    </head>


    <body ng-app="NoNameApp">


<!--    <div class="navbar navbar-default" role="navigation" bs-navbar> -->
<!--        <ul class="nav navbar-nav"> -->
<!--            <li data-match-route="home"><a href="#/home">Home</a></li> -->
<!--            <li data-match-route="/page-one"><a href="#/page-one">Page One</a></li> -->
<!--            <li data-match-route="/page-two.*"><a href="#/page-two/sub-a">Page Two</a></li> -->
<!--        </ul> -->

<!--        <div ng-view></div> -->
<!--    </div> -->

        <div ng-controller="MainController">

            <ul class="nav nav-pills span6">
                <li><a ng-click=changeRoute('home')>Home</a></li>
                <li><a ng-click=changeRoute('login')>Login</a></li>
                <li><a ng-click=changeRoute('accounts')>Accounts</a></li> 
            </ul>

        <div ng-view></div>

        </div>



    <div>
        <script type="text/javascript" src="<c:url value="script/bower_components/jquery/dist/jquery.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/angular/angular.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/bootstrap/dist/js/bootstrap.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/angular-animate/angular-animate.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/angular-route/angular-route.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/angular-sanitize/angular-sanitize.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/angular-strap/dist/angular-strap.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/angular-strap/dist/angular-strap.tpl.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/lodash/dist/lodash.compat.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/lodash/dist/lodash.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/lodash/dist/lodash.underscore.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/ng-table/ng-table.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="script/bower_components/restangular/dist/restangular.min.js"/>"></script>
    </div>

    </body>





</html>

Did you well import angular-route.js file? Can you show your index.html? — Mik378
you should include also the following files: angular-route and angular-sanitize — Nicolai
these scripts are all included, scroll down to the last part of the codeblock — user3929268
Hi remove the ngSanitize in your angular.module("NoNameApp",['ngRoute','ngSanitize']) replace into angular.module("NoNameApp",['ngRoute']) and then check it... — parthicool05

parthicool05 parthicool05 · Accepted Answer · 2014-08-11T12:16:55

Replace your script file into this code:

var NoNameApp= angular.module("NoNameApp", [
    // Angular modules 
    'ngAnimate',        
    'ngRoute',         
    'ngSanitize',              
]);


NoNameApp.run(['$route', function ($route) {

}]);


NoNameApp.config(['$routeProvider',function($routeProvider){

$routeProvider.

when('/home',{templateUrl:'views/partials/home.html'}).
otherwise({redirectTo: '/', templateUrl: 'views/partials/home.html'});


}]);


NoNameApp.controller('MainController',  ['$rootScope','$scope','$location',function($rootScope,$scope,$location){

$scope.dataForAllPages = {};
$scope.globalFunctions = {};


}]);

Check the edited code friend...

Angular js injection error

2 Answers