Ionic Sidemenu打電話給TABS頁面

我正在嘗試創建一個離子的應用程序，它具有sidemenu，而sidemenu將包含一組菜單，其中一些菜單將調用TABS頁面，一些菜單將打開到普通頁面。Ionic Sidemenu打電話給TABS頁面

我能夠創建sidemenu以及從另一個普通頁面調用另一個普通頁面的功能，但是我堅持使用將調用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>

來源

2016-04-19 Joseph Goh

我前一段時間遇到了類似的問題，但在我的情況下，錯誤是因爲我已經把''標籤內的另一個。乍一看，我能想到的唯一情況是'fg-tabs.html'內容似乎不在'離子視圖'中。不知道這是否重要，tbh。無論如何，檢查我的[問題]（http://stackoverflow.com/questions/30579219/ionic-side-menu-and-tabs-with-nested-views-content-of-tab-nested-views-not-show）和它收到的答案。希望這可能會給你一些線索。 –

fg-tabs.html應該在'ion-view'包裝內，因爲它具有'menuContent'的視圖，其中'menuContent'在這一行'' –

如果我把內容代碼直接放在每個''裏面，那麼它會顯示出來，但是如果我使用模板則不會顯示。 –

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

insted的的<ion-item menu-close href="#/app/fg-tabs"> <i class="icon ion-cube"></i> Product </ion-item>

的更多信息，請閱讀this

同時刪除的ion-tabhref屬性，並在其中添加一些內容。您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>

來源

2016-04-19 06:10:32

謝謝，學到了一些新東西，但它並沒有回答我上面的問題。 –

請查看更新後的答案 –

爲什麼我不能使用模板作爲每個標籤的內容？ –

Ionic Sidemenu打電話給TABS頁面

回答

相關問題