Module not getting injected in another module

Question

I am trying to inject a module as a dependency of another module. Here's my code for that -

USER.JS -

'use strict'
    var module = angular.module('startUp', ['ngMaterial', 'ngRoute', 'signUpModule']);

module.controller('myController', function($scope) {
});

module.config(['$mdThemingProvider','$routeProvider', function($mdThemingProvider, $routeProvider){
        // Configure a dark theme with primary foreground yellow
        $mdThemingProvider.theme('default')
            .primaryPalette('teal')
            .accentPalette('brown')
            .dark();
        $mdThemingProvider.setDefaultTheme('default');


    }]);

SIGNUP.JS-

'use strict'

var signUpModule = angular.module('signUpModule', ['ngMaterial', 'ngMessages', 'ngRoute']);

signUpModule.controller('signUpController', function($scope) {
        $scope.user = {
            title: '',
            email: '',
            firstName: '',
            lastName: '' ,
            company: '' ,
            address: '' ,
            city: '' ,
            state: '' ,
            biography: '',
            postalCode : ''
        };
    });
signUpModule.config( function($mdThemingProvider){
        // Configure a dark theme with primary foreground yellow
        $mdThemingProvider.theme('docs-dark', 'default')
            .primaryPalette('pink')
            .dark();
    });

Here's my HTML -

<body ng-app="startUp">
<section ng-controller="myController">
    <md-content>
        <md-toolbar class="md-primary" layout-gt-sm="row" layout-sm="column">
            <div class="md-toolbar-tools logo" flex="10">
            </div>
            <span flex-gt-lg="70" flex-gt-md="50" flex-gt-sm="30" hide-sm></span>
            <div class="md-toolbar-tools" flex-gt-sm="20" flex-sm="10">
                <md-button class="md-no-ink md-accent" ng-href="http://www.last.fm/api/auth/?api_key=32ec32811f5c4db3c68317004d8a7d32&cb=http://localhost:65194/LastFM/index.html"
                           target="_blank" flex>Log In</md-button>
                <md-button class="md-no-ink md-accent" ng-href="signup" flex>Register</md-button>
            </div>
        </md-toolbar>
        <!--<section class="content">
            <h1 class="font">Connect to your LAST FM Profile!</h1>
            <md-content ></md-content>
        </section>-->
        <div ng-view></div>
        <section class="footer">

        </section>
    </md-content>
</section>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-resource.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.js"></script>

<script src="user.js" type="text/javascript"></script>
<script src="signup.js" type="text/javascript"></script>

Here's the error -

`Error: [$injector:modulerr] http://errors.angularjs.org/1.3.15/$injector/modulerr?p0=startUp&p1=%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.3.15%2F%24injector%2Fmodulerr%3Fp0%3DsignUpModule%26p1%3D%255B%2524injector%253Amodulerr%255D%2520http%253A%252F%252Ferrors.angularjs.org%252F1.3.15%252F%2524injector%252Fmodulerr%253Fp0%253DngMessages%2526p1%253D%25255B%252524injector%25253Anomod%25255D%252520

Any idea why this injection is not happening? Is there something wrong with my code? I checked online and even some sample projects on GITHUB, but could find no difference.

Cant see you including the signUpModule js file at the html. — Fals
– Fals, Commented Apr 29, 2015 at 19:30
Try loading signup.js before user.js, signup defines a module used as a dependency of the module in user. Also be sure to use unminified angular when debugging problems for better errors. — shaunhusain
– shaunhusain, Commented Apr 29, 2015 at 19:35

Martin · Accepted Answer · 2015-04-29 19:37:05Z

1

You are missing the following script include

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0-rc.0/angular-messages.js"></script>

ngMessage is not being initialized which causes signUpModule to fail. Adding the above should fix that problem

answered Apr 29, 2015 at 19:37

Martin

2,43711 gold badges30 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Pratik Over a year ago

Stupid mistake on my part. It was part of the signup html page, but didn't include it here. Thanks for the help!!

Collectives™ on Stack Overflow

Module not getting injected in another module

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related