angular + require.js :Failed to instantiate module

Question

My code : index.html

<html ng-app='Arrows'>
 <script data-main="main" src="require.js"></script>
<div ng-controller="My">
  {{status}}
</div>

And main.js file

    require(["jquery","underscore","backbone",
"marionette","angular"], function($ ,_,Backbone,Marionette,angular){

      debugger

       var app = angular.module("Arrows")
      angular.element(document).ready(function () {
            angular.bootstrap(document, ['Arrows']);
        });  

      app.controller('My', function($scope) {
            $scope.status = 'hello! Its working!';
        });
    })

I have problem :

Uncaught Error: [$injector:modulerr] Failed to instantiate module Arrows due to: Error: [$injector:nomod] Module 'Arrows' 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.

turhanco · Accepted Answer · 2014-09-05 05:59:56Z

8

Remove the ng-app directive from your html. You already manually bootstrap it.

<script data-main="main" src="require.js"></script>
<div ng-controller="My">
  {{status}}
</div>

That has to be enough for code.

By the way I would not use Backbone and Angular in a same app.

answered Sep 5, 2014 at 5:59

turhanco

94110 silver badges19 bronze badges

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

2 Comments

Michael Phelps Over a year ago

I get error: Error: [ng:areq] Argument 'My' is not a function, got undefined

turhanco Over a year ago

Can you prepare a jsfiddle or plunker as a playground? Thus we can edit and see what is wrong.

knutesten · Accepted Answer · 2014-09-05 05:48:12Z

1

You must instantiate the module

angular.module('name', [])  // this will instantiate the module

angular.module('name')      // this will not instantiate the module and give you 
                            // an error if the previous line has not been called first. 
                            // This function can be used to add controllers, services 
                            // etc. to the module, for example in another file.

answered Sep 5, 2014 at 5:48

knutesten

5963 silver badges17 bronze badges

2 Comments

Michael Phelps Over a year ago

I added angular.module("Arrows",[]) but the same result ....Help me please.....please

knutesten Over a year ago

I get it working when adding angular.module("Arrows", []). plnkr.co/edit/ysdNKDXcHB1BBgXwQcIf?p=preview Maybe you problem is using require, backbone etc. Do you really need these frameworks when using Angular?

GournaySylvain · Accepted Answer · 2015-06-23 10:42:17Z

0

From my understanding, this is a problem of loading sequence, I may be mistaken but according to what I've experienced:

the html files are loading first
requireJs file is executed

Then, the problem is that each time you use an angular directive, it is resolved before the actual module/controller/etc. is loaded.

The trick of bootstraping the app to the document works, but in order to have a fully fonctional application, you need to bootstrap everything manually and not using the "ng-controller" (and other directives).

For me, this is not a solution, just a workaround and I'm sure requireJs can (or should) do better, so either it's a requireJs' bug or there is another solution.

Hope this helps!

answered Jun 23, 2015 at 10:42

GournaySylvain

4711 gold badge3 silver badges16 bronze badges

Collectives™ on Stack Overflow

angular + require.js :Failed to instantiate module

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related