离子菜单模板未在移动设备上显示

Question

我使用他们页面上的向导创建了我的 Ionic 应用程序，并选择了模板“菜单”。如果我在桌面版中查看我的应用程序，它完全没问题，您可以在此处看到：Desktop view OK 但是，如果我在浏览器 (Firefox) 中切换到“移动视图”，菜单不会显示？？如您所见：Mobile view no menu

这是我的 html 菜单代码：

    <ion-app>
  <ion-split-pane contentId="main-content">
    <ion-menu contentId="main-content" type="overlay">
      <ion-content>
        <ion-list id="inbox-list">
          <ion-list-header>Netzwerkverwaltung</ion-list-header>
          <ion-note></ion-note>

          <ion-menu-toggle auto-hide="false" *ngFor="let p of appPages; let i = index">
            <ion-item  routerDirection="root" [routerLink]="[p.url]" lines="none" detail="false" routerLinkActive="selected">
              <ion-icon slot="start" [ios]="p.icon + '-outline'" [md]="p.icon + '-sharp'"></ion-icon>
              <ion-label>{{ p.title }}</ion-label> 
            </ion-item>
          </ion-menu-toggle>
        </ion-list>

      </ion-content>
    </ion-menu>
    <ion-router-outlet id="main-content"></ion-router-outlet>
  </ion-split-pane>
</ion-app>

Answer 1

您将 ion-menu 放在 ion-split-pane 中。

因此可见性取决于 windows!

的宽度

您可以使用从边框滑动来从移动设备打开您的侧边菜单菜单的侧面。
使用menuController.toggle()
或在 ion-header!

ion-menu-button

小屏隐藏菜单！！

文档：

离子菜单按钮：https://ionicframework.com/docs/api/menu-button

菜单切换：https://ionicframework.com/docs/api/menu-toggle

菜单控制器：https://ionicframework.com/docs/v4/api/menu-controller

离子菜单模板未在移动设备上显示

Ionic Menu Template not showing on mobile

html

typescript

ionic-framework

angular