ember.js dinamik bileşenleri

Question

İki Modelleri Admin ve User başvurum şablonu var, ben açıklamak: Eğer admin kimlik doğrulaması user kimliğinin {{user-header}} görüntülenmesi gerektiğinde, {{admin-header}} bileşenini oluşturmak istiyorum. Dinamik olarak application.hbs içinde nelerin üretileceğini nasıl yapılandırabilirim? böylece,

// application controller 
isAdmin: Ember.computed(function() { 
    // your logic here 
}) 

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

veya isAdmin özelliğiyle header-nav bileşeni olarak bunu sarabilirdiniz:

Answer 1

Sen Uygulama Kontrolörü içinde isAdmin bilgisayarlı özellik tanımlamak olabilir

// application template 
{{header-nav isAdmin=isAdmin}} 

GÜNCELLEME (Ayrıntıları kor-basit ile -yeni için @Grimmy)

1) Enjekte Et currentUser i Nto session (https://stackoverflow.com/a/30894082/4950029 örneğin)

2) beforeModel kanca currentUser giderin ve currentUser kontrol özelliğini ayarlamak:

//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}} 

ya gibi {{component}} yardımcı kullanabilir

//controller 
roleBasedComponentName: Ember.computed('currentUser.role', function() { 
    return ((this.get('currentUser.role') === 'admin') ? 'admin-header' : 'user-header'); 
}) 

//template 
{{component roleBasedComponentName user=currentUser}} 

Answer 2

yanıtlamadıysa, ancak İlk önce, kontrol cihazınızda, belirtilen bileşen adının bulunması gerekir:

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

Ardından, şablonunda:

{{component nameForComponent}} 

O tasarlandı ve bu tür kullanım durumları için kısa süre önce tanıttı.

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