Angular + require.js: failed to instantiate module
My code: index.html
<html ng-app='Arrows'>
<script data-main="main" src="require.js"></script>
<div ng-controller="My">
{{status}}
</div>
And the 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 a problem:
Unprepared error: [$ injector: modulerr] Failed to instantiate the Arrows module due to: Error: [$ injector: nomod] The Arrows module is not available! You either misspelled the name of the module, or forgot to load it. If registering the module ensures that you specify the dependencies as the second argument.
source to share
Remove the ng-app directive from your html. You have already manually downloaded it.
<script data-main="main" src="require.js"></script>
<div ng-controller="My">
{{status}}
</div>
This is enough for the code.
By the way, I would not use Backbone and Angular in the same application.
source to share
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.
source to share
In my opinion this is a sequence loading issue, I may be wrong, but according to what I experienced:
- html files are loaded first. Performed
- requireJs file
The problem then is that every time you use an angular directive it resolves to the actual module / controller / etc. is loaded.
The trick of loading the application into a document works, but for a fully functional application you need to load everything manually and not use 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 mistake for requireJs or there is another solution.
Hope this helps!
source to share