如何自定义application.hbs模板的view元素？ [英] How do I customize the view element for the application.hbs template?

查看：122 发布时间：2017/8/16 0:58:53 ember.js ember-cli

本文介绍了如何自定义application.hbs模板的view元素？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

 < p> ; body class =ember-application> 
< div id =ember284class =ember-view> 
< / div> 
< / body>

如果我创建一个组件，我有一个component-name.js文件，我可以指定选项修改组件：

 导出默认值Ember.Component.extend（{
 tagName：'nav'，
 classNames：['main-menu']，
 layout：layout 
}）;

如何修改正在包装application.hbs模板的元素的属性？

解决方案

 从ember导入Ember; 
 
导出默认Ember.View.extend（{
 classNames：['my-app-view'] 
 //这是应用程序视图
}）;

现在通过检查您的HTML来确认它的工作原理：

 < body class =ember-application> 
< div id =ember287class =ember-view my-app-view> 
< h2 id =title>欢迎使用Ember.js< / h2> 
< / div> 
< / body>

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>

这篇关于如何自定义application.hbs模板的view元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文