Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

EmberJS - register precompiled handlebars template

For my EmberJS app, I precompile all of my handlebars templates, so they are being loaded as straight Javascript files.

The problem is that these precompiled templates are not making their way into the Ember container like I thought that they would - I get the following error when I specify a template for my view.

Uncaught Error: assertion failed: You specified the templateName "application" for <MyApp.ApplicationView:ember164>, but it did not exist. 

Here is my view code.

window.MyApp.ApplicationView = Ember.View.extend({
   templateName: 'application'
});

I stepped through the execution and saw that the views do not exist in the Ember container. Is there something special I need to do to register precompiled templates with the container? If so, how?

Edit: I've been compiling the templates with the handlebars npm package.

like image 360
Jarrod Nettles Avatar asked Mar 01 '13 23:03

Jarrod Nettles


People also ask

How do I use precompiled handlebars templates?

These templates may be executed in the same manner as templates. If using the simple mode the precompiler will generate a single javascript method. To execute this method it must be passed to the Handlebars. template method and the resulting object may be used as normal.

What is handlebars template in Ember?

Ember uses the Handlebars templating library to power your app's user interface. Handlebars templates contain static HTML and dynamic content inside Handlebars expressions, which are invoked with double curly braces: {{}} . Dynamic content inside a Handlebars expression is rendered with data-binding.

What is handlebars compile?

Handlebar. compile() can be used to produce a templating function. A template string with expressions must be passed into Handlebar. compile() . That function then takes an object as an argument, interpolates the object's values into the template expressions, and returns a completed HTML string.


2 Answers

Templates are looked up on Ember.TEMPLATES (which is just a hash with the template name as the key)

So when your example ApplicationView is executed it will look for the template in Ember.TEMPLATES['application']

like image 163
chrixian Avatar answered Oct 22 '22 16:10

chrixian


While the npm handlebars compiler does indeed compile them correctly, you still need to register them with Ember in order for them to load correctly. You can do one of the following:

  • Manually load them with Ember.TEMPLATES['sometemplate'] = COMPILED TEMPLATE. This works but becomes something of a pain.
  • Use a special compiler like npm ember-precompile, which will compile them in such a way that the compiled templates are automatically registered in the Ember template container.
like image 22
Jarrod Nettles Avatar answered Oct 22 '22 14:10

Jarrod Nettles