How to replace page tabbar using Onsenui

匿名 (未验证) 提交于 2019-12-03 01:00:01

问题:

When I use myNavigator.pushPage() I am redirecting the user to a new page from an index.html page, however I only want the tabbar from the page the user is being redireted to show, currently it shows the redireted page tabbar underneath the main index.html tabbar:

Index.html

<ons-sliding-menu var="menu" main-page="main.html" menu-page="menux.html" max-slide-distance="90%" type="reveal" side="left"> </ons-sliding-menu>  <ons-template id="main.html"> <ons-navigator var="myNavigator">     <ons-page ng-controller="LoginController">         <ons-tabbar position="top">           <ons-tabbar-item  style="margin-top:20px;border-right:1px solid #ec6d2f" icon="ion-navicon" onclick="menu.toggleMenu()"></ons-tabbar-item>           <ons-tabbar-item page="dashboard.html"  icon="ion-ios-pulse-strong" active="true"  class="tab-bar__button tab-bar--top-border__button"></ons-tabbar-item>           <ons-tabbar-item page="timeline.html"  icon="ion-android-calendar"></ons-tabbar-item>           <ons-tabbar-item page="negative.html"  icon="ion-android-walk"></ons-tabbar-item>           <ons-tabbar-item page="capture.html"  icon="ion-pinpoint"></ons-tabbar-item>          </ons-tabbar>     </ons-page> </ons-navigator> </ons-template>

Settings.html

<ons-page ng-controller="Settings">     <ons-tabbar position="top">         <ons-row>             <ons-col width="15%">                <div style="margin-top:5px"><ons-back-button>              </ons-back-button></div>             </ons-col>             <ons-col width="45%" align="left">                 <div style="padding-top:18px;color:#fff">Settings</div>             </ons-col>             <ons-col width="20%" align="left">              </ons-col>                     </ons-row>     </ons-tabbar>      <div class="login-form">         <ons-row style="padding-top: 30px;padding-bottom:10px; text-align: center;">             <ons-col>                 <div  align="center" style="padding:10px;font-size:0.8em">Update your settings below</div>             </ons-col>         </ons-row>                    <ons-row style="margin-top: 20px; text-align: center;">             <input type="email" class="text-input--underbar" placeholder="Email" ng-model="emailx" id="emailx">             <input type="text" class="text-input--underbar" placeholder="First Name" ng-model="firstname" id="firstname">             <input type="text" class="text-input--underbar" placeholder="Last Name" ng-model="lastname" id="lastname">             <input type="password" class="text-input--underbar" placeholder="Password" value="" id="password">              <p style="margin-top:15px">             <ons-button modifier="large" class="login-button" ng-click="updateSettings();">Update</ons-button>             </p>         </ons-row>     </div>      <ons-row style="padding: 20px; text-align: center;border-bottom:1px solid #e3e3e3">         <div  align="center"> </div>      </ons-row>         <ons-row style="padding: 20px; text-align: center;">         <ons-col >              <ons-button modifier="large" style="background:#ccc" ng-click="logout()">Logout</ons-button>          </ons-col>     </ons-row>      </ons-page>

Notice how I have a tabbar in settings.html, right now this shows underneath the tabbar from index.html, but I want it to replace it or show just by itself when user is redirected to settings.html by pushPage()

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!