Why does coffeescript angular demo fail in jsfiddle when an identical javascript one works?

Question

I was building a jsfiddle angular app in coffeescript. It failed, and I reduced the failure to this minimal one:

<body ng-app="MyApp">
    <div ng-controller="MyController">
        {{text}}
    </div>
</body>

This javascript fiddle works: http://jsfiddle.net/nje7H/

var app = angular.module("MyApp", []);

app.controller("MyController", function($scope) {
    $scope.text = "Hello."
});

However, this coffeescript fiddle fails: http://jsfiddle.net/nje7H/1/

app = angular.module "MyApp", []

app.controller "MyController", ($scope) ->
    $scope.text = "Hello."

The console shows "Uncaught Error: No module: MyApp"

Why?

Community · Accepted Answer · 2017-05-23 10:26:22Z

2

jsfiddle uses <script type="text/coffeescript"> elements and a library to compile the coffeescript on the client, which doesn't occur until the dom is ready and the code doesn't execute until after angular bootstraps. It will work if you manually bootstrap angular in your code (fiddle):

angular.bootstrap document.body, ['MyApp']

In a production environment you should be compiling your coffeescript into javascript for the browser and there wouldn't be a problem. See this question.

edited May 23, 2017 at 10:26

CommunityBot

11 silver badge

answered Jun 10, 2014 at 18:54

Jason Goemaat

29.3k15 gold badges89 silver badges119 bronze badges

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

1 Comment

mu is too short Over a year ago

AFAIK, jsfiddle.net uses <script type="text/coffeescript"> and client-side compilation of the CoffeeScript. That would support your conjecture, a quick View Source in the CoffeeScript fiddle would clear things up.

Collectives™ on Stack Overflow

Why does coffeescript angular demo fail in jsfiddle when an identical javascript one works?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related