如何在 Ember 应用程序的主模板中指定部分

Question

是否可以在 Ember 应用程序主模板 (application.hbs) 中指定命名部分，然后在路由模板中覆盖它们？即，做这样的事情：

application.hbs

...
<div id="main-content">{{outlet}}</div>
<div id="bottom-panel">{{yield "bottom-panel"}}</div>
...

然后，在路由模板中覆盖 {{yield "bottom-panel"}} 内容。

Answer 1

ember 本身还没有。为此有一些插件，例如 ember-block-slots。

但是有is an RFC for this，所以将来会成为ember的一部分。

ember-wormhole, or ember-elsewhere.

也很有趣

这里有趣的是看看你想阻止哪个方向流动。如果你想把东西放在父组件的其他地方，请查看 ember-wormhole 或 ember-elsewhere。如果你想让一个组件指定多个父级可以放置内容的地方，那么ember-block-slots是正确的选择。另外，如果你有这些 things 你想放在子组件中的地方是组件，你可以用普通的 ember:

{{#my-component footer=(component 'my-super-footer')}}
  Main stuff
{{/my-component}}

然后在 my-component:

中执行此操作

<div class="main">
  {{yield}}
<div>
<div class="footer">
  {{component footer}}
</div>

如何在 Ember 应用程序的主模板中指定部分

How to specify sections in main template of Ember application

javascript

templates

handlebars.js

ember.js