Error: $injector:modulerr Module Error

Question

I am facing this strange issue. I know that it is happening due to an dependency injection failure. I don't know what exactly is the reason. According to me, my module is not expecting any injections, that's why I have empty array there. Then why am I facing this issue ? Here is the code.

<!DOCTYPE html>
<html ng-app="aMailServices">
<head>
    <title>Home Page</title>
    <link type="text/css" rel="stylesheet" href="Styles/bootstrap.css" />
    <link type="text/css" rel="stylesheet" href="Styles/bootstrap-theme.css" />

    <script type="text/javascript" src="Scripts/angular.js"></script>
    <script>
        var aMailServices = angular.module('aMailServices', []);

        /*function testRouteProvider($routeProvider) {

            $routeProvider.when('/', {
                controller: 'SimpleController',
                templateUrl: 'NewProfile.html'
            })
            .when('/search', {
                controller: 'SimpleController',
                templateUrl: 'SearchPage.html'
            });
        }

            testProject.config(testRouteProvider);*/

        function emailRouteConfig($routeProvider) {
            $routeProvider.
            when('/', {
                controller: 'SimpController',
                templateUrl: 'list.html'
            }).
            // Notice that for the detail view, we specify a parameterized URL component
            // by placing a colon in front of the id
            when('/view/:id', {
                controller: 'SimpController',
                templateUrl: 'detail.html'
            }).
            otherwise({
                redirectTo: '/'
            });
        };
        // Set up our route so the AMail service can find it
        aMailServices.config(emailRouteConfig);

        var SimpController = function ($scope) {

        };

        aMailServices.controller(SimpController);

    </script>
    <style type="text/css">
        body {
            padding: 15px;
        }

        .inCenter {
            text-align: center;
            text-decoration: underline;
        }

        .borderBotton {
            font-size: 1.2em;
            font-variant: small-caps;
            border-bottom: 1px solid #ddd;
        }

        .topMargin {
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <!--Controller And ng-app-->
    <div class="col-xs-12 inCenter">
        <h1>Test Project</h1>
    </div>

    <div class="col-xs-12">
        <ul class="nav nav-tabs">
            <li class="active">
                <a href="#">Create Profile</a>                              <!--On CLick-->
            </li>
            <li>
                <a href="#">Search Profile</a>
            </li>
        </ul>
    </div>

    <div class="col-xs-12 topMargin">
        <div ng-view></div>
    </div>
</body>
</html>

Answer 1

Actually your application DOES have dependency you are not aware of: "ngRoute". The routing functionality is separated into different file. Include it and use "ngRoute" as dependency module. If you using bower, include "angular-route" module in bower.json.

Error: $injector:modulerr Module Error

Question

1 answers

solution1
1 ACCPTED 2014-05-05 20:32:48

Error: $injector:modulerr Module Error

Question

1 answers

solution1 1 ACCPTED 2014-05-05 20:32:48

solution1
1 ACCPTED 2014-05-05 20:32:48