Marionette LayoutView에서 지역을 제거하는 방법 ...? 내 템플릿에서

Question

는이 같은 #header and #content 내부의 2 요소가 있습니다

Social.AppLayout = Backbone.Marionette.LayoutView.extend({ 
     el:'div#wrapper', 
     template:'#appTemp', 
     regions:{ 
      header:'div#header', 
      content:'div#content' 
     } 
    }); 

을하지만 로그인 페이지를 표시하는 동안, 나는 페이지의 content 요소를 렌더링하지 않습니다. 그래서 나는이 같은 레이아웃을 렌더링하는 동안 해당 지역을 제거하려고 :

그러나 제거되지 않습니다. 내 질문 :

a) 해당 페이지에 적합한 지역을 어떻게 표시합니까? b) 지역을 추가하고 제거하는 목적은 무엇입니까?

아무도 설명해 주시겠습니까? 이걸 구현하는 올바른 방법을 보여줘? 미리 감사드립니다.

Answer 1

설명 된 유스 케이스를 해결하기 위해 헤더 및 내용보기가 영역 개념과 통합되어야합니다.

<div id="container"></div> 

<script id="appTemp" type="text/html"> 
    <div id="header"></div> 
    <div id="content"></div> 
</script> 


<script id="headerTmpl" type="text/html"> 
    <div>Header</div> 
</script> 

<script id="contentTmpl" type="text/html"> 
    <div>Content</div> 
</script> 

자바 스크립트 코드 : 작동 예는 here

HTML 코드에

당신이 당신의 엘에 대한 선택을 지정하고 있기 때문에

var HeaderView = Backbone.Marionette.ItemView.extend({ 
     template:'#headerTmpl' 
}); 

var ContentView = Backbone.Marionette.ItemView.extend({ 
     template:'#contentTmpl' 
}); 

AppLayout = Backbone.Marionette.LayoutView.extend({ 
     el:'div#container', 
     template:'#appTemp', 
     regions:{ 
      header:'div#header', 
      content:'div#content' 
     }, 
     onRender: function() { 
      //console.log ('show menu'); 
      if (this.header) 
       this.header.show (new HeaderView()); 
      if (this.content) 
       this.content.show (new ContentView()); 
     } 
}); 


layout = new AppLayout(); 
//layout.removeRegion("content");//uncomment this to remove the content region 
layout.render();