Próbuję Backbone.Marionette i jestem zdezorientowany, dlaczego moje Layouts i ItemViews nadal generują dodatkowe divy.

przykład jest w Coffee btw.

AppLayout = Backbone.Marionette.Layout.extend
  template: "#my-layout",

  regions:
    menu: "#menu",
    content: "#content"

MyMenuView = Backbone.Marionette.ItemView.extend
  template: '#project_wiz_nav_template'

MyContentView = Backbone.Marionette.ItemView.extend
  template: '#project_setup_template'

MyApp = new Backbone.Marionette.Application()

MyApp.addRegions
  mainRegion: '#project'

MyApp.addInitializer ->
  layout = new AppLayout()
  MyApp.mainRegion.show(layout)

  layout.menu.show(new MyMenuView())
  layout.content.show(new MyContentView())

MyApp.start()

Oto, co zawiera index.html:

<div id='project'></div>
<script type='text/template' id='project_wiz_nav_template'> <h2>HI</h2> </script>
<script type='text/template' id='project_setup_template'> <h2>WORLD</h2> </script>
<script id="my-layout" type="text/template">
  <h2>Hello!</h2>
  <div id="menu"></div>
  <div id="content"></div>
</script>

To właśnie produkuje:

<div id="project">
  <div>
    <h2>Hello!</h2>
    <div id="menu">
      <div> 
        <h2>HI</h2> 
      </div>
    </div>
    <div id="content">
      <div> 
        <h2>WORLD</h2> 
      </div>
    </div>
  </div>
</div>

Jak widać, generuje dodatkowe div dla widoków i układów. Próbowałem dodaćel: '#menu' iel: '#content' bezskutecznie.