title: Sliding menu with Tab bar in Onsen UI
body: <p>I'm having trouble making work a tabbed bar interface with a sliding menu using Onsen UI. The problem is that when I click on a item on the sliding menu, the tab bar disappears. Here is my code:</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;ons-sliding-menu
      behind-page="views/menu.html" above-page="views/tab-bar.html" side="left"
      type="reveal" max-slide-distance="300px" swipable="true"&gt;
  &lt;/ons-sliding-menu&gt;  
  </code></pre>
  
  <p><strong>views/menu.html</strong></p>
  
  <pre><code>&lt;ons-page style="background-color: white"&gt;
      &lt;ons-list&gt;
        &lt;ons-list-item
          modifier="chevron"
          ng-click="ons.slidingMenu.setMainPage('views/home.html', {closeMenu: true})"&gt;
          &lt;i class="fa fa-home fa-lg" style="color: #666"&gt;&lt;/i&gt; &amp;nbsp; Noticias
        &lt;/ons-list-item&gt;
        &lt;ons-list-item 
          modifier="chevron"
          ng-click="ons.slidingMenu.setMainPage('views/settings.html', {closeMenu: true})"&gt;
          &lt;i class="fa fa-gear fa-lg" style="color: #666"&gt;&lt;/i&gt; &amp;nbsp; Reportar Pago
        &lt;/ons-list-item&gt;
      &lt;/ons-list&gt;
  &lt;/ons-page&gt;
  </code></pre>
  
  <p><strong>views/tab-bar.html</strong></p>
  
  <pre><code>&lt;ons-tabbar var="barra"&gt;
      &lt;ons-tabbar-item
        active="true"
        label="Home"
        icon="home"
        page="views/home.html"&gt;
      &lt;/ons-tabbar-item&gt;
      &lt;ons-tabbar-item
        label="Camera"
        icon="camera"
        page="views/camera.html"&gt;
      &lt;/ons-tabbar-item&gt;
      &lt;ons-tabbar-item
        label="Settings"
        icon="gear"
        page="views/settings.html"&gt;
      &lt;/ons-tabbar-item&gt;
  &lt;/ons-tabbar&gt;
  </code></pre>