Ionic Sidemenu позвонить на страницу TABS

0

Я пытаюсь создать ионное приложение, которое будет иметь sidemenu, тогда как 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'
      }
    }
  })

фг-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>
  • 0
    Я столкнулся с подобной проблемой некоторое время назад, но ошибка в моем случае была из-за того, что я поместил <ion-content> внутри другого. На первый взгляд, единственное, о чем я могу думать, - это то, что содержимое fg-tabs.html видимому, не находится в ion-view . Не уверен, если это имеет значение, чч В любом случае, проверьте мой вопрос и ответ, который он получил. Надеюсь, это может дать вам некоторую подсказку.
  • 0
    файл fg-tabs.html должен находиться внутри оболочки ion-view поскольку он имеет представления menuContent где menuContent находится в этой строке <ion-nav-view name="menuContent"></ion-nav-view>
Показать ещё 2 комментария
Теги:
ionic-framework

1 ответ

0

используйте <ion-item menu-close ui-sref="app.fg-tabs"> <i class="icon ion-cube"></i> Product </ion-item>

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

для получения дополнительной информации, пожалуйста, прочтите это

Также удалите атрибут href ion-tab и добавьте в него некоторый контент. ваш 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>

  • 0
    спасибо, узнал что-то новое, но это не отвечает на мой вопрос выше.
  • 0
    Пожалуйста, просмотрите обновленный ответ
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню