Ember.js EmberJS：如何定位应用程序模板

我遇到了一个问题。我需要

App.rootElement=“body”

，因为视图和组件将被到处使用。我不想把整个网页在一个把手模板，由于搜索引擎优化和其他问题。主应用程序模板将位于页面中心的某个位置：

<h1>Header markup</h1>

<script type="text/x-handlebars">
  <h2>Application Template</h2>

  {{outlet}}
</script>

<h1>Footer markup</g1>

标题标记
应用程序模板
{{outlet}}
页脚标记

但是，在呈现页面时，此模板将附加到正文的末尾，而不是停留在放置模板脚本的位置。（请参阅）是否有任何方法可以告诉Ember将应用程序模板呈现在标记中的位置

---

我发现的一个棘手的解决方案是手动移动

didInsertElement

中的包含元素，但这似乎有点笨手笨脚，不是最佳做法。（请参见）

脚本标记与放置无关，如果您希望它位于某个地方，请创建一个div标记，对其进行标识，并将rootElement更改为该div标记

<script type="text/x-handlebars">
  <h2>Application Template</h2>

  {{outlet}}
</script>

应用程序模板
{{outlet}}

标题标记
页脚标记
App.rootElement='#foo'；

这就是问题所在。rootElement需要包围整个页面，但我不能将整个页面放在Handlebar模板中。如果我可以将rootElement本地化到这一点，并将视图和组件放置在它之外，而不必抱怨余烬，那么它就可以工作了。

<h1>Header markup</h1>
<div id='foo'></div>
<h1>Footer markup</h1>

App.rootElement = '#foo';