Ionic Sidemenu TABSページへの呼び出し

Question

サイドメニューを持つイオニクスのアプリケーションを作成しようとしていますが、サイドメニューはTABSページといくつかの通常ページに呼び出される一連のメニューから構成されます。

別の通常のページから別の通常のページに呼び出すためのサイドメニューとその機能を作成することはできますが、TABSページを呼び出すメニューが表示されます。 TABSページが表示されますが、各タブには内容は表示されません。

誰でも手伝ってもらえますか？

これはいくつかのコードです。

menu.html

<ion-side-menus enable-menu-with-back-views="false"> 
    <ion-side-menu-content> 
    <ion-nav-bar class="bar-royal"> 
     <ion-nav-back-button> 
     </ion-nav-back-button> 
     <ion-nav-buttons side="left"> 
     <button class="button button-icon button-clear ion-navicon button-small" 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-royal"> 
     <h1 class="title">Menu</h1> 
    </ion-header-bar> 
    <ion-content> 
     <ion-list> 
     <ion-item menu-close href="#/app/fg-tabs"> 
      <i class="icon ion-cube"></i> 
      Product 
     </ion-item> 
     </ion-list> 
     </ion-content> 
    </ion-side-menu> 
</ion-side-menus> 

app.js

.state('app', { 
    url: '/app', 
    abstract: true, 
    templateUrl: 'templates/menu.html', 
    controller: 'MenuCtrl' 
    }) 
    .state('app.fg-tabs', { 
    url: "/fg-tabs", 
    views: { 
     'menuContent': { 
     templateUrl: "templates/fg/fg-tabs.html", 
     } 
    } 
    }) 
.state('app.fg-in', { 
    url: "/fg-in", 
    views: { 
     'menuContent': { 
     templateUrl: "templates/fg/fg-in.html", 
     controller: 'FGinListCtrl' 
     } 
    } 
    }) 

FG-tabs.html

<ion-tabs class="tabs-positive tabs-icon-top"> 

    <ion-tab title="IN" icon-on="ion-arrow-down-a" icon-off="ion-arrow-up-a" href="#/app/fg-in"> 
    <ion-nav-view name="menuContent"></ion-nav-view> 
    </ion-tab> 

    <ion-tab title="OUT" icon-on="ion-arrow-up-a" icon-off="ion-arrow-up-a" href="#/app/fg-out"> 

    <!-- Tab 2 content --> 
    </ion-tab> 

    <ion-tab title="ENQUIRY" icon-on="ion-document-text" icon-off="ion-document-text" href="#/app/fg-scanner-out"> 
    <!-- Tab 3 content --> 
    </ion-tab> 

</ion-tabs> 

Answer 1

使用<ion-item menu-close ui-sref="app.fg-tabs"> <i class="icon ion-cube"></i> Product </ion-item>

は、より多くの情報のため<ion-item menu-close href="#/app/fg-tabs"> <i class="icon ion-cube"></i> Product </ion-item>

のinsted this

またion-tabのhref属性を削除し、その中のいくつかのコンテンツを追加をお読みください。あなたのfg-tabs.htmlが

<ion-tabs class="tabs-positive tabs-icon-top"> 
<ion-tab title="IN" icon-on="ion-arrow-down-a" icon-off="ion-arrow-up-a"> 
    <ion-nav-view name="menuContent"> 
     Tab content 1 
    </ion-nav-view> 
</ion-tab> 
<ion-tab title="OUT" icon-on="ion-arrow-up-a" icon-off="ion-arrow-up-a"> 
    Tab content 2 
</ion-tab> 
<ion-tab title="ENQUIRY" icon-on="ion-document-text" icon-off="ion-document-text"> 
    Tab content 3 
</ion-tab>