2016-06-22 35 views
1

我目前在我的應用程序中使用ionics sliding sideview來導航,但是我想切換到新的選項卡。我已經改變了代碼來製作標籤,但$ state.go似乎不再工作。這裏是舊的滑動導航代碼:從sideview到tabview的離子/角度切換

<ion-side-menus> 

     <ion-pane ion-side-menu-content=""> 
     <ion-nav-bar class="bar-balanced nav-title-slide-ios7"> 
     <ion-nav-buttons side="left"> 
      <button class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button> 
     </ion-nav-buttons> 
     </ion-nav-bar> 
     <ion-nav-view></ion-nav-view> 
     </ion-pane> 

     <ion-side-menu side="left" class="main-menu"> 
     <ion-header-bar class="bar bar-header bar-dark"> 
      <h1 class="title">Menu</h1> 
     </ion-header-bar> 

      <ion-content has-header="true" ng-controller="SplashCtrl"> 

      <ion-list> 
      <ion-item class="heading-item item item-avatar" nav-clear="" menu-close="" ui-sref="app.profile"> 

      <div class="user-image-container"> 
      <pre-img ratio="_1_1" helper-class="rounded-image"> 
       <img class="user-image" ng-src="img/logo.jpg" spinner-on-load=""> 
      </pre-img> 
      </div> 
      <h2 class="greeting">{{welcomename}}</h2> 
      <p class="message">Welcome back</p> 
     </ion-item> 
     <ion-item class="item-icon-left" nav-clear="" menu-close="" ui-sref="utab.google" ng-click="googleLoginClick()"> 
      <i class="icon ion-document"></i> 
      <h2 class="menu-text">My Diary</h2> 
     </ion-item> 

     <ion-item class="item-icon-left" nav-clear="" menu-close="" ui-sref="utab.history" ng-click="historyClick()"> 
      <i class="icon ion-document"></i> 
      <h2 class="menu-text">Search</h2> 
     </ion-item> 

     <ion-item class="item-icon-left" nav-clear="" menu-close="" ui-sref="utab.tasklist" ng-click="tasklistClick()"> 
      <i class="icon ion-document"></i> 
      <h2 class="menu-text">Task List</h2> 
     </ion-item> 

     <ion-item class="item-icon-left" nav-clear="" menu-close="" ui-sref="utab.myforms" ng-click="myFormsClick()"> 
      <i class="icon ion-document"></i> 
      <h2 class="menu-text">Unsent Instructions ({{unsentFormsCount}})</h2> 
     </ion-item> 

     <ion-item class="item-icon-left" nav-clear="" menu-close="" ui-sref="utab.banking" ng-click="bankingClick()"> 
      <i class="icon ion-document"></i> 
      <h2 class="menu-text">Banking</h2> 
     </ion-item> 

     <ion-item class="item-icon-left" nav-clear="" menu-close="" ng-click="logoutClick()"> 
      <i class="icon ion-document"></i> 
      <h2 class="menu-text">Logout</h2> 
     </ion-item> 


      </ion-list> 

     </ion-content> 
     </ion-side-menu> 

    </ion-side-menus> 

ng-clicks中的「XXclick」函數只需調用$ stat.go's即可。這裏是新的導航:

(我剛加入最上面的一個,以減少代碼)

<ion-tabs class="tabs-icon-top tabs-color-active-positive"> 
<ion-content has-header="true" ng-controller="SplashCtrl"> 

    <ion-tab title="Diary" icon-off="ion-ios-calendar-outline" icon-on="ion-ios-calendar" ui-sref="utab.google" ng-click="googleLoginClick()"> 
    <ion-nav-view name="diary"></ion-nav-view> 
    </ion-tab> 

</ion-content> 
</ion-tabs> 

得到任何幫助。

回答

0

首先不需要在標籤中使用離子含量。在路由中也應該有問題。你能更新完整的代碼或創建代碼筆嗎?所以我可以幫助你。我認爲下面的代碼筆鏈接將幫助你。

'http://codepen.io/nirmal25/pen/BzQxzX' 
+0

它是一個相當大的項目! –