Define application template in Ember.View in the most recent Ember.js Build

Question

I recently upgraded to the most recent Ember.js build (built from the GitHub page.)

When using the new router, does this no longer work?

App.ApplicationView = Ember.View.extend({
    template: Ember.Handlebars.compile("Hello")
});

I much prefer to define my templates in my js file rather than index.html. I believe it is much cleaner. However, the above does not render!

Any suggestions? Thanks!

Answer 1

For Ember 1.0, templates should be defined in index.html or in separate files that are provided to your application via a build tool.

Some examples:

• For Grunt
• For Brunch
• For the Rails Asset Pipeline
• For Iridium
• A Standalone Precompiler

If you really, really want to put your template in JavaScript, you can put this in your application template:

<script type="text/x-handlebars">
  {{view App.MyView}}
</script>

And then define your view:

App.MyView = Ember.View.extend({
  template: Ember.Handlebars.compile("Whatever you want here")
});

That said, the happy path in Ember is to use external templates for each of your routes, either in your HTML when you're getting started, or using a build step so you can keep them out of your index.html.