Backbone.js inline templates not working in Opera

Question

I've created a backbone.js app which uses inline templates, example of below:

<script type="text/html" id="header-template">
<div class='header'>
<strong><%= name %></strong>
</div>
</script>

Then in the the View:

template = _.template($("#header-template").html());

In Opera this throws an error due to $("#header-template").html() returning null. Does anyone know how to fix this issue?

Thanks

Update:

The error I'm getting in the console is Unhandled Error: 'App.view.header' is not a constructor . When I update underscore.js and backbone.js to the latest versions I also get this error in Chrome.

The header is defined like this:

App.view.header = App.view.header || {} 

App.view.header = Backbone.View.extend({
...
});

and rendered like this in the router:

$('header').html( new App.view.header().render().el);

Another update

I've created a tiny backbone.js app which has the same problem:

http://goo.gl/KoOvq

Answer 1

You could wrap the template in a function and call it only when needed.

I like this way more because if you start to put your templates in another files they will be loaded only when needed, the way you are doing now they are loaded at the app start.

template = function(variables){ return _.template(template, variables) }