9

I'm trying to switch my Ember application over to using the Ember.Router but am having an issue with where the application template gets appended. When I call App.initialize() it renders the template at the end of the document. Is there a way to specify where the rendered application template gets appended to?

My application is a rails app and I'm trying to embed an Ember application on one of my pages. I don't want to change the way my current header and footer gets rendered so ideally I would be able to specify where ember renders the template.

Here is a jsfiddle example. You can see that it renders:

Header Content 
Footer Content 
Test 1 
Test 2 
Test 3

What I'm trying for is:

Header Content
Test 1
Test 2
Test 3
Footer Content
Improve this question

1 Answer 1

Reset to default
13

Set the rootElement property of the Ember.Application: http://jsfiddle.net/vAxkL/3/

Doc: http://docs.emberjs.com/symbols/Ember.Application.html

EDIT -- Fixed the fiddle by anchoring to the 1.0.pre version: http://jsfiddle.net/vAxkL/11/

Improve this answer
2
  • 1
    Not sure why but I had to do rootElement: '#application' rather than rootElement: $('#application')
    – rtremaine
    Commented Sep 7, 2012 at 17:14
  • Worth also mentioning that when you use a rootElement other than body, anywhere you call append() on a view needs to be changed to appendTo('#id-of-your-root-element') or Ember fails in some strange ways.
    – rtremaine
    Commented Sep 8, 2012 at 2:31

Not the answer you're looking for? Browse other questions tagged or ask your own question.