In an app generated by ember-cli, the html generated by application.hbs is wrapped in a view:
<body class="ember-application">
<div id="ember284" class="ember-view">
</div>
</body>
If I create a component, I have a component-name.js file where I can specify options to modify the component:
export default Ember.Component.extend({
tagName: 'nav',
classNames: ['main-menu'],
layout: layout
});
How do I modify the attributes of the element that is wrapping the application.hbs template?
create a file in the app/views directory that follows the naming conventions, application.js
import Ember from "ember";
export default Ember.View.extend({
classNames: ['my-app-view']
// this is the application view
});
Now confirm it works by inspecting your html:
<body class="ember-application">
<div id="ember287" class="ember-view my-app-view">
<h2 id="title">Welcome to Ember.js</h2>
</div>
</body>
The Ember.View direct access is deprecated starting from version 2.x. What they did, is they have converted the Ember.View to an abstract class. Now you should use Ember.Component. As the short-cut, you could try something like this:
// app/views/application.js
import Ember from 'ember';
export default Ember.Component.extend({
classNames: ['customClassName']
});
来源:https://stackoverflow.com/questions/29177037/how-do-i-customize-the-view-element-for-the-application-hbs-template