Ember.js – una visualizzazione di più layout (loggato / non loggato)

Nel mio attuale progetto Ember ho un sistema di authentication in atto. Alcune pagine sono visualizzabili solo dagli utenti autenticati. Controllare se l'utente è autenticato e controllare l'accesso a una pagina è abbastanza semplice, quindi non ci sono problemi.

Il problema è che ho alcune pagine che sono visualizzabili da entrambi gli utenti autenticati e non autenticati. Un utente autenticato vede una navigazione diversa (barre superiori e laterali) di un utente non autenticato (più opzioni di navigazione, impostazioni, ecc.). Voglio cambiare il layout che viene utilizzato in base a se l'utente è autenticato o no. Il problema è che posso solo impostare un layout a una vista.

Il codice generale è qualcosa del tipo seguente:

layout:

<script type="text/x-handlebars" data-template-name="authenticated_layout"> //authenticated layout mark up {{yield}} </script> <script type="text/x-handlebars" data-template-name="not_authenticated_layout"> //not_authenticated layout mark up {{yield}} </script> 

Modello articolo (gli articoli possono essere visualizzati dagli utenti autenticati o non autenticati):

 <script type="text/x-handlebars" data-template-name="article"> //article mark up </script> 

Visualizzazione articolo:

 App.ArticleView = Ember.View.extend({ templateName: "article", layoutName: //want this to be based on authentication state //other view code }) 

Ho di avere una vista diversa per each layout e rendere il model con la visualizzazione in base all'affidabilità dell'utente. Il problema che vedo là è che gli ArticlesView non solo hanno impostato il layout, e preferisco non avere due viste distinte che differiscono solo dalla properties; layoutName .

Qualsiasi consiglio sarebbe molto apprezzato.

Penso che una properties; calcasting nel tuo layoutName potrebbe funzionare.

Codice pseudonimo:

 App.ArticleView = Ember.View.extend({ templateName: "article", layoutName: function() { // you can use your own logic to know if the user is authenticated // but don't forget to add in the property(dependenKey), if needed return App.get('currentUser') ? 'authenticated_layout' : 'not_authenticated_layout'; }.property('App.currentUser') })