javascript - Ember.js 动态组件

Question

我有两个模型 Admin 和 User我的申请模板如下

//application.hbs
{{outlet}}
{{header-nav}}

我想做什么(如果可能的话)使 {{header-nav}} 可定制，我解释说:如果 admin 验证我想渲染组件 {{admin-header}}在 user 进行身份验证的情况下，它应该呈现 {{user-header}}。我如何构建要在 application.hbs 中动态呈现的内容？

Answer 1

您可以使用 {{component}} 帮助程序，但您需要先确定组件名称，因此，在您的 Controller 中:

nameForComponent: Ember.computed('user.isAdmin', function()  {
// if admin return admin-header else user-header
})

然后，在您的模板中:

{{component nameForComponent}} 

它是不久前为此类用例设计和推出的。

你也可以更花哨:

{{component (if user.isAdmin 'admin-header' 'user-header') }}