侧边菜单干扰 ionic 中的选项卡式视图

Question

我基本上有一个滑动菜单应用程序。每个菜单项都会打开一个视图，我在其中填充数据。这一切都很好，但在一个视图中，我想要一个带幻灯片的离子寻呼机。似乎滑动菜单并没有让这个控件起作用。要么就是这样，要么我做错了什么。

当我单击“事件 G”菜单选项时会发生什么，它会出现在事件图表 html 中，但幻灯片根本无法正确显示。 OTOH，如果我删除侧边菜单结构，视图效果很好。

我的 menu.html：

<ion-side-menus enable-menu-with-back-views="false">
  <ion-pane ion-side-menu-content>
    <ion-nav-bar class="bar-positive">
      <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-pane>


 <ion-side-menu side="left">
    <ion-header-bar class="bar-dark">
      <h1 class="title">Options</h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>


        <!-- this view works great - its a normal view -->
        <ion-item nav-clear menu-close href="#/app/events">
            <span class=" item-icon-left">
            <i class="icon ion-ios-calendar-outline"></i>
            </span>
          Events
        </ion-item>

          <!-- this view messes up the display -->
          <ion-item nav-clear menu-close href="#/app/events-graphs">
            <span class=" item-icon-left">
            <i class="icon ion-ios-calendar-outline"></i>
            </span>
          Events Graph Tabs
        </ion-item>

        <ion-item menu-close href="#/app/filters">
            <span class=" item-icon-left">
            <i class="icon ion-funnel"></i>
            </span>
          Filters
        </ion-item>

        <ion-item nav-clear menu-close href="#/app/login">
            <span class=" item-icon-left">
                <i class="icon ion-ios-gear-outline"></i>
            </span>
            Settings
        </ion-item>

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


</ion-side-menus> 

现在这里是“事件图”的代码

我没有发布任何控制器代码，因为他们目前没有做任何与此示例相关的操作。

<ion-view view-title="Monitor Event Summary" cache-view="false">


<ion-content>
      <ion-slide-box>
          <ion-slide-pager> </ion-slide-pager>
              <ion-slide>
                  <!-- <canvas tc-chartjs chart-type="bar" chart-options="options" chart-data="data" auto-legend></canvas> -->
                Slide 1
              </ion-slide>
              <ion-slide>
                   <div class="box blue"><h1>BLUE</h1></div>
              </ion-slide>
          <ion-slide>
                    Slide 3
              </ion-slide>

      </ion-slide-box>
   </ion-content>

</ion-view>

当我移动到“事件图表”视图时，这是我的应用程序的外观，该视图应该显示一个漂亮的滑动窗口，其中包含 3 个屏幕。

如果我将 events-graph.html 更改为显示 3 个选项卡，我看不到选项卡图标，并且内容隐藏在导航栏下 - 所以我很确定我没有在侧边菜单中做正确的事情- 但我不知道是什么。有什么想法吗？

Answer 1

删除<ion-slide-pager> </ion-slide-pager>。它在其中一个 beta 版本中被删除。将show-pager="true" 添加到<ion-slide-box> 元素以显示寻呼机。