首页 > 解决方案 > 离子侧菜单不显示?

问题描述

在登录页面后的我的离子应用程序中,我使用了侧边菜单。登录后侧边菜单正常显示,但如果我注销并且没有刷新登录到页面,侧边菜单不显示,但菜单按钮可见。

按钮:

 <ion-buttons start>
    <button ion-button icon-only menuToggle>
        <ion-icon name="menu"></ion-icon>
    </button>
 </ion-buttons>

菜单代码:

<ion-menu>
    <ion-content>
      <ion-list>
        <ion-navbar color="primary">
          <div class="row">
            <ion-title>HBLOAD</ion-title>
            <button ion-button menuClose>X</button>
          </div>
        </ion-navbar>
        <br>
        <div class="mainbody">
          <button ion-button full (click)="profile()">Profile</button>
          <button ion-button full (click)="changepin()">Change Pin</button>
          <button ion-button full (click)="changepassword()">Change Password</button>
          <button ion-button full (click)="accesslogs()">Access Logs</button>
          <button ion-button full (click)="logout()">Logout</button>
        </div>
      </ion-list>
    </ion-content>
    </ion-menu>

标签: angularionic-frameworkionic3

解决方案


您应该在文件中编写侧面菜单的代码app.html

定义[content]属性<ion-menu>

例子:

<ion-menu [content]="content">
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content class="nav">

  </ion-content>

</ion-menu>

<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

推荐阅读