2014-09-07 3 views
0

В моем шаблоне, у меня есть 2 элемента внутри #header and #content так:Как удалить регион из марионетки LayoutView ...?

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

Но пока я показать страницу входа в систему, я не хочу, чтобы сделать content элемент страницы. поэтому я пытаюсь удалить этот регион, пока я делаю такой макет:

Social.App.addInitializer(function(){ 
     this.route = new Social.Routes; 
     this.layout = new Social.AppLayout; 
     this.layout.removeRegion("content", "#content"); // removing the content region !? 
     this.layout.render(); 
     Backbone.history.start(); 
    }); 

Но он не удаляется. Мой вопрос:

a) Как я могу показать соответствующие регионы для соответствующей страницы? b) Какова цель добавления и удаления регионов?

Может ли кто-нибудь объяснить мне, пожалуйста? показать мне правильный способ реализовать это, пожалуйста? Спасибо заранее!

+0

Поскольку вы указываете селектор для вашего эл, я предполагаю, что вы прикрепление ваш взгляд уже сделанная страница? – kinakuta

ответ

1

Для рассмотрения описанного варианта использования представления для заголовка и содержимого необходимо включить в концепцию Region. Рабочий пример в here

HTML код:

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

JavaScript код:

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(); 
+0

Я согласился с вашим ответом. У меня есть еще один запрос к вам. В случае, если у меня есть элемент внутри 'contaiener' say 'headerContaienr' - есть ли способ добавить мой заголовок в 'headerContainer' внутри элемента 'contaiener'? - вот скрипка http://jsfiddle.net/q0Lbv61s/8/ – 3gwebtrain

Смежные вопросы