Ember.js - 하나의보기 다중 레이아웃 (로그인/로그인하지 않음)

Question

현재 Ember 프로젝트에서 인증 시스템을 사용하고 있습니다. 특정 페이지는 인증 된 사용자 만 볼 수 있습니다. 사용자가 인증되고 페이지에 대한 액세스를 제어하는지 확인하는 것은 간단하므로 아무런 문제가 없습니다.

인증 된 사용자와 인증되지 않은 사용자가 볼 수있는 특정 페이지가 있습니다. 인증 된 사용자는 인증되지 않은 사용자 (다른 탐색 옵션, 설정 등)와는 다른 탐색 (상단 및 측면 막대)을 보게됩니다. 나는 사용자의 인증 여부에 따라 어떤 레이아웃이 사용되는지를 바꾸고 싶다. 문제는보기에 하나의 레이아웃 만 설정할 수있는 것입니다.

레이아웃 :

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

제 템플릿 (기사가 인증 또는 인증되지 않은 사용자가 볼 수 있습니다) :

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

제

일반적인 코드는 다음과 같은 것입니다 보기 :

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

각 레이아웃에 대해 다른 시각을 가지고 있으며 사용자가 인증되었는지 여부에 따라보기로 템플릿을 렌더링했습니다. 내가 볼 수있는 문제는 ArticlesView 뿐이며 레이아웃을 설정하는 것 이상을 수행합니다. 실제로는 layoutName 속성에 따라 다른 두 개의 개별보기가 필요하지 않습니다.

모든 조언을 주시면 감사하겠습니다.

Answer 1

layoutName의 계산 된 속성이 작동한다고 생각합니다.

의사 코드 : 작동

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') 
})