在给定的HTML标记内包含EmberJS应用程序

Question

HTML

头

`<script type="text/x-handlebars" data-template-name="application">  
    {{view App.NavbarView}}  
    {{outlet}}  
</script>`  

页脚

JS

`App.ApplicationController = Em.Controller.extend();  
App.ApplicationView = Em.View.extend({  
  templateName: 'application'  
});`  

App.Router = Em.Router.extend({
enableLogging: true,
location: 'hash',

root: Em.Route.extend({
  // EVENTS
  gotoAbout: Ember.Route.transitionTo('about'),

  // STATES
  about: Em.Route.extend({
    route: '/',
    connectOutlets: function (router, context) {
      router.get('applicationController').connectOutlet('about');
    }
  })

我想要删除,data-template-name="application"因为我想立即在这个代码块的位置(在页眉和页脚之间)显示这个.

但是当我删除这个和templateName: 'application'路由器不工作.

问题是:如何显示块

<script type="text/x-handlebars" data-template-name="application">  
  {{view App.NavbarView}}  
  {{outlet}}  
</script>

页眉和页脚之间.

我知道我可以写<div id="content"></div>和使用,.appendTo("content")但也许存在更优化的方式？

Answer 1

你试过设置App的rootElement财产吗？

App = Ember.Application.create({
  rootElement: '#app-container'
});

你在这里有一个例子,你可以很容易地推导出来.