1

Hello and excuse my english.

My problem is this: I'm a beginner to Angular js (currently learning with version 1.4) and I want to separate my application in two modules like this:

app.js

(function(){
var app = angular.module('store', ['store-products', 'ngAnimate', 'ui.bootstrap']);



    app.controller('StoreController', function(){
        ...
        });

    app.controller('ReviewController', function(){
        ...
        };

        this.rateOnClick = function(){
            ...
        };

        this.addReview = function(product){
            ...
        };
        });


    .
    .
    .
})();

products.js

(function(){

    var app = angular.module('store-products', []);

    app.directive('productTitle', function(){
            ...
        });

    app.directive('productPanels', function(){
            ...

        });
})();

index.html

<html>
  <head>
    <title>My Angular App!</title>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-animate.js"></script>
    <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.2.4.js"></script>
    <link href="styles.css" rel="stylesheet">
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
    <script src="app.js"></script>
    <script src"products.js"></script>
...
</html>

All of my files are in the same folder. app.js is the primary module, so as far I understand the includes are fine, but I still get the error:

Uncaught Error: [$injector:modulerr] Failed to instantiate module store due to:
Error: [$injector:modulerr] Failed to instantiate module store-products due to:
Error: [$injector:nomod] Module 'store-products' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Can't someon figure out why this is happening ?

2

3 Answers 3

1

LOL, just figured out, the problem was the line:

<script src"products.js"></script>

Fixed like this:

<script src="products.js"></script>
Sign up to request clarification or add additional context in comments.

Comments

0

You need to include your products script before your app script.

2 Comments

This should have resolved your problem. Are you certain there isn't another error in the console? Typically when you see this and your scripts are referenced in the correct order there was some syntax error in products.js which caused a chain reaction error leading to the module injection error you are reporting.
Seriously, I even created a new module with no directives or controllers called test.js and tried to included, but same error.
0

Do not include store-products in your app.js code because in this [ ] we add directives and there is no directive name 'store-products'

1 Comment

Not sure who upvoted this, but this answer is incorrect. What the OP did is valid and is the way that other Angular modules are injected as dependencies into the module currently being defined.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.