2

我尝试在我的网络应用程序上将 EmberJS 从 pre1 更新到 pre2，但我注意到它将所有车把模板作为最后一个正文元素，有时根本没有。

我已经使用 starter-kit创建了一个 repro ，只需修改在模板之前和之后放置 div 以显示模板将被添加到错误的位置。使用 pre1 运行同一页面，一切正常。

索引.html

……

<body>
  <div>this is before the template</div>
  <script type="text/x-handlebars" data-template-name="application">
    <h1>Hello from Ember.js</h1>
  </script>
  <div>this is after the template</div>

……

4

1 回答 1

5

text/x-handlebars 脚本标签定义了一个 Handlebar 模板，它与您在页面中放置它的位置无关（在头部，在正文中的任何位置）。

在上面的代码中，您定义了ApplicationView. 由于您使用路由器，ember 会自动创建ApplicationView并将其附加到您的 Ember 应用程序的根元素中。默认情况下，rootElement是正文：

App.ApplicationView.create().appendTo(rootElement) // default rootElement = 'body'

并且该appendTo方法使用 jQuery appendTo：

this.$().appendTo(target)

因此，如果您想控制applicationView插入的位置，您需要rootElement在 App 实例中设置，如下所示：

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

...

  <body>
    <div>this is before the template</div>
    <script type="text/x-handlebars" data-template-name="application">
      <h1>Hello from Ember.js</h1>
    </script>
    <div id="insert_my_app_here"></div>
    <div>this is after the template</div>
  </body>
于 2012-11-10T20:57:03.440 回答