Question

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

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

我想做的事情（如果有可能）使{{header-nav}}可自定义，我解释说：如果admin身份验证我要呈现组件{{admin-header}} 在user身份验证的情况下，它应该呈现{{user-header}}。如何动态地在application.hbs中构建要呈现的内容？

Answer 1

您可以在Application Controller中定义from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC计算属性：

isAdmin

或者您可以将其包装为具有// application controller isAdmin: Ember.computed(function() { // your logic here }) // application template {{#if isAdmin}} {{admin-header}} {{else}} {{user-admin}} {{/if}}属性的header-nav组件，因此：

isAdmin

UPDATE （使用ember-simple-auth for @Grimmy的详细信息）

1）将// application template {{header-nav isAdmin=isAdmin}}注入currentUser（例如https://stackoverflow.com/a/30894082/4950029）

2）在session挂钩中解析currentUser并设置beforeModel控制器属性：

currentUser

或如上所述

//route
beforeModel: function() {
  var self = this;
  this.session.get('currentUser').then(function(user) {
    self.controllerFor( self.routeName ).set('currentUser', user);
  },function() {
    self.controllerFor( self.routeName ).set('currentUser', null);
  });
}

//controller
isAdmin: Ember.computed('currentUser.role', function() {
  return (this.get('currentUser.role') === 'admin');
}),

//template
{{#if isAdmin}}
  {{admin-header}}
{{else}}
  {{user-admin}}
{{/if}}

Answer 2

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

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

然后，在您的模板中：

{{component nameForComponent}}

这是针对此类用例而设计和介绍的。

你也可以更加花哨：

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

Ember.js动态组件

2 个答案: