emberjs add class or id to the body tag

Question

I have read this SO post on how to add tags with a class to a view i.e. ::

App.ApplicationView = Ember.View.extend
  name: 'Home',
  layoutName: 'layouts/application',
  templateName: 'views/home'
  tagName: 'div'
  elementId: 'home'

However, is there a way to adjust the application setup i.e. ::

window.App = Ember.Application.create
    Store: DS.Store.extend
        revision: 10,
        adapter: DS.fixtureAdapter

To configure a "class" or "id" attached to the body tag?

Current Ember Setup:

DEBUG: ------------------------------- 
DEBUG: Ember      : 1.5.1 ember.js?body=1:3522
DEBUG: Handlebars : 1.3.0 ember.js?body=1:3522
DEBUG: jQuery     : 2.1.1 ember.js?body=1:3522
DEBUG: -------------------------------

Current source view:

<body class="ember-application" data-ember-extension="1">
<div id="home" class="ember-view">
<h1>Ember Layout</h1>
<h1>Home View</h1>
</div>
</body>

I will note I am using emblemjs for my handlebars templates and the body is setup in the application layout.

Kingpin2k · Answer 1 · 2014-05-13T03:49:55.347

1

Your body tag isn't being created by Ember, just put it in your html.

<body id='foo' class='bar'></body>

Additionally as of Ember Data 1.0 beta 1, you no longer create the store, you should just define adapters. See https://github.com/emberjs/data/blob/master/TRANSITION.md

I'd just attach ember to a div inside of the body element instead of the body.

<body class='foo'>
  <div id='putEmberHere'></div>
</body>

App = Ember.Application.create({
  rootElement: '#putEmberHere'
});

edited May 13 '14 at 03:49

answered May 12 '14 at 18:20

Kingpin2k

47,277
10
78
96

I updated my current response, do you have any other tips? The body tag is still getting rewritten on load. – Chris Hough May 13 '14 at 03:41
Sure, don't attach to body, attach to an element inside of it. – Kingpin2k May 13 '14 at 03:50
I just came across this solution which gives me a bit of flexibility setting classes in the body tag. http://stackoverflow.com/questions/20781154/add-css-classes-to-body-in-ember-js – Chris Hough May 13 '14 at 04:10

score 0 · Accepted Answer · edited May 23 '17 at 11:52

0

After reading add-css-classes-to-body-in-ember-js and jquery attr id, I went with this solution:

App.ApplicationRoute = Ember.Route.extend
  activate: ->
    this._super();
    document.title = Ember.get('App.var_page_default_title')
    $('body').attr id: 'view_home'

edited May 23 '17 at 11:52

Community

1
1

answered May 13 '14 at 04:11

Chris Hough

3,389
3
41
80

emberjs add class or id to the body tag

2 Answers2

Linked