2015-01-17 4 views
5

Я хотел бы разместить вкладку внутри приложения боковой панели, но только в некоторых представлениях приложения. В приложении имеется следующая госструктура:Ионные вкладки и история бокового меню

|--- Login    (login: menuContent) 
|--- Orders list   (app.orders: menuContent) 
    |--- Description  (app.orderTabs.description: orderTabs-description) 
    |--- Products   (app.orderTabs.products: orderTabs-products) 
     |--- New product (app.orderTabs.products.newProduct: orderTabs-products) 
|--- Alerts list   (app.alerts: menuContent) 
    |--- Description  (app.alertTabs: alertTabs-description) 
    |--- Settings   (app.alertTabs: alertTabs-settings) 

быть каждая запись | --- ViewTitle (состояние: название ионно-нав-вид)

menu.html:

<ion-side-menus enable-menu-with-back-views="false"> 
    <ion-side-menu-content> 
    <ion-nav-bar class="bar-stable"> 
     <ion-nav-back-button> 
     </ion-nav-back-button> 

     <ion-nav-buttons side="left"> 
     <button class="button button-icon button-clear ion-navicon" menu-toggle="left"> 
     </button> 
     </ion-nav-buttons>  
    </ion-nav-bar> 
    <ion-nav-view name="menuContent"></ion-nav-view> 
    </ion-side-menu-content> 

    <ion-side-menu side="left"> 
    <ion-header-bar class="bar-stable"> 
     <h1 class="title">Menu</h1> 
    </ion-header-bar> 
    <ion-content> 
     <ion-list> 
     <ion-item nav-clear menu-close href="#/app/orders"> 
      Orders list 
     </ion-item> 
     <ion-item nav-clear menu-close href="#/app/alerts"> 
      Alerts list 
     </ion-item> 
     <ion-item nav-clear menu-close ng-click="logout()"> 
      Logout 
     </ion-item> 
     </ion-list> 
    </ion-content> 
    </ion-side-menu> 
</ion-side-menus> 

orderTabs.html:

<ion-tabs class="tabs-icon-top tab-bar"> 

    <ion-tab title="Order" icon="icon ion-clipboard" href="#/app/orderTabs/{{ data.order.id }}/description"> 
    <ion-nav-view name="orderTabs-description"></ion-nav-view> 
    </ion-tab> 


    <!-- products Tab --> 
    <ion-tab title="Products" icon="icon ion-checkmark-circled" href="#/app/orderTabs/{{ data.order.id }}/products" badge="data.badgeProducts" badge-style="badge-assertive"> 
    <ion-nav-view name="orderTabs-products"></ion-nav-view> 
    </ion-tab> 

</ion-tabs> 

Я хотел бы иметь возможность перейти от описания или продукции б ack to list of orders, любой знает, возможно ли это?

На данный момент я достиг, чтобы показать кнопку в очереди, но при создании представления вкладки с ионами история очищается.

Из списка управления заказов:

$scope.goToOrder = function gotToOrder(orderId) { 
    $ionicViewSwitcher.nextDirection('forward'); 
    $ionicHistory.nextViewOptions({ 
     historyRoot: false 
    }); 
    $state.go('app.orderTabs.order', { 
     orderId: orderId 
    }); 
    }; 

ответ

0

Я была такая же проблема, как вы и после поиска я узнал, что это на самом деле то, что команда Ионных реализована на цели благодаря вкладкам проекций, имеющая историю на ее , поэтому на самом деле они не записывают представления, в которых есть вкладка навигации в истории. Похоже, что это не будет решено в ближайшее время, поэтому я решил самостоятельно создать модифицированную реализацию вкладок. Я в основном имитирую внешний вид вкладок, а затем контролирую контент, показанный с помощью ng-show.

<div class="tabs-striped tabs-top"> 
    <div class="tab-nav tabs"> 
     <a class="tab-item" 
       ng-class="{'tab-item-active': tabs.active == 'description'}" 
       ng-click="tabs.active = 'description'"> 
      <span>Description</span> 
     </a> 
     <a class="tab-item" 
       ng-class="{'tab-item-active': tabs.active == 'pending'}" 
       ng-click="tabs.active = 'products'"> 
      <span>Products</span> 
     </a> 
    </div> 
</div> 
Смежные вопросы