温泉使用导航器和侧边栏在同一页上

Question

我是OnsenUI的新手。我试图展示一个使用导航器的页面，我也希望在同一页面上有一个侧边栏。根据文件，这是可能的，但我努力争取这个工作。我目前有：

<ons-sliding-menu var="sidebar" main-page="index.html" menu-page="menu.html" max-slide-distance="200px" type="reveal" side="left"> 
</ons-sliding-menu> 

<ons-navigator title="Navigator" var="mainNavigator"> 
    <ons-page id="home-page"> 
     <ons-toolbar> 
      <div class="center">TITLE</div> 
     </ons-toolbar> 
     <ons-list id="main-list"> 
     </ons-list> 
    </ons-page> 
</ons-navigator> 

<ons-template id="menu.html"> 
    <ons-page> 
     <h1>Sidebar</h1> 
    </ons-page> 
</ons-template> 

但是，这并不显示侧边栏或提供侧边栏功能。我找不到有关如何执行此操作的任何文档。有任何想法吗？

Answer 1

是的，这是可能的。下面应该是您的index.html内容：

的index.html：

<ons-sliding-menu var="sidebar" main-page="main.html" menu-page="menu.html" max-slide-distance="200px" type="reveal" side="left"> 
</ons-sliding-menu> 

<ons-template id="main.html"> 
<ons-navigator title="Navigator" var="mainNavigator"> 
    <ons-page id="home-page"> 
     <ons-toolbar> 
      <div class="center">TITLE</div> 
     </ons-toolbar> 
     <ons-list id="main-list"> 
     </ons-list> 
    </ons-page> 
</ons-navigator> 
</ons-template> 

<ons-template id="menu.html"> 
    <ons-page> 
     <h1>Sidebar</h1> 
    </ons-page> 
</ons-template> 

或者看看温泉文档： http://onsenui.io/guide/components.html#ons-sliding-menu

就这样，你可以看到他们是如何它在： http://codepen.io/onsen/pen/IDvFJ