CODEWITHSUNDEEP
javascriptangularjscoffeescript
neolitec
neolitec

Reputation: 35

Unable to load an angularjs module in coffeescript

I try to make an AngularJS application entierly in CoffeeScript but when my main module is loading, I've got this error :

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

My app is very simple :

Here's my index.html :

<html ng-app="app">
<head>
<script type="text/javascript" src="javascripts/angular.js"></script>
<script type="text/javascript" src="javascripts/angular-route.js"></script>
<script type="text/javascript" src="javascripts/coffee-script.js"></script>
<script type="text/coffeescript" src="coffee/app.coffee"></script>
</head>
<body></body>
</html>

And my app (app.coffee) is just : 

angular.module 'app', []

I don't understand why my 'app' module is not available because if I replace app.coffee by its compiled version (app.js), it work.

Why? What is the problem?

Upvotes: 1

Views: 2205

Answers (1)

Stefan
Stefan

Reputation: 14880

The app.coffee file gets compiled after angular tries to bootstrap the page. What you could do to make this work is to manually bootstrap the ng-app.

In your app.coffee:

angular.element(document).ready ->
  angular.module 'app', []
  angular.bootstrap document, ['app']

and get rid of the ng-app directive on the html tag. For more info check Angular Bootstrap.

Me for myself would not seriously consider this setup in a productive app. I'd rather compile the coffee script server side...

Upvotes: 2

Related Questions