如何在某些页面上禁用 Sidemenu Ionic 2

Posted 2023-03-13

【中文标题】如何在某些页面上禁用 Sidemenu Ionic 2

【英文标题】：How to disable Sidemenu on certain pages Ionic 2

【发布时间】：2019-05-27 23:13:32

【问题描述】：

我正在用ionic 3构建一个项目，前3页使用空白的ionic模板，因为它与登录，注册然后验证有关，然后您进入应用程序主页，然后我使用了侧边菜单离子模板

我已成功构建应用程序并且一切正常，但是在添加侧边菜单模板后它会影响空白模板，如果您在屏幕上向左滑动侧边菜单会显示.. 这是我的代码..

在 app.html 上

<ion-menu [content]="content">
<ion-header>
    <ion-toolbar>
        <ion-title>Menu</ion-title>
    </ion-toolbar>
</ion-header>
<ion-content>        
   <div style="height:130px;"><img src="assets/imgs/titlebg.jpg"/> </div>
    <ion-list>
        <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
            p.title <ion-badge *ngIf="p.badge" end>234</ion-badge>
        </button>
    </ion-list>
    </ion-content>


    <ion-footer>
        <p align="center" style="color:#333333"> WihofaCITY.com</p>
    </ion-footer>
</ion-menu>


<ion-nav id="nav" #content  [root]="rootPage"></ion-nav>

在验证帐户视图模板上我有这个

<ion-header>
    <ion-navbar color="">
      <ion-title>Current Subscription</ion-title>
    </ion-navbar>
  </ion-header>

  <ion-content padding>
    <!---- content goes here ---->
    <ion-grid>
      <ion-row>
      </ion-row>
    </ion-grid>

  </ion-content>

我删除了 menutoggle 按钮，但如果你在这些页面上滑动，这就是我所做的

     <ion-navbar>


<!------------i removed this section ----------------->

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

<!------------i removed this section ----------------->

     <ion-title>Current Subscription</ion-title>
    </ion-navbar>
  </ion-header>

  <ion-content padding>
    <!---- content goes here ---->
    <ion-grid>
      <ion-row>
      </ion-row>
    </ion-grid>

  </ion-content>

但仍然无济于事，请问有什么我应该做的，还是没有做的？提前致谢。

【问题讨论】：

您需要删除整个ion-header。试试这个，它会解决你的问题

我做到了..它没有工作..真诚的。

你能告诉我删除ion-header后显示的是哪个@

【参考方案1】：

您可以从控制器启用/禁用侧边菜单，如下所示

<ion-menu [content]="content" id="mymenu">
<ion-header>
    <ion-toolbar>
        <ion-title>Menu</ion-title>
    </ion-toolbar>
</ion-header>
<ion-content>        
   <div style="height:130px;"><img src="assets/imgs/titlebg.jpg"/> </div>
    <ion-list>
        <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
            p.title <ion-badge *ngIf="p.badge" end>234</ion-badge>
        </button>
    </ion-list>
    </ion-content>


    <ion-footer>
        <p align="center" style="color:#333333"> WihofaCITY.com</p>
    </ion-footer>
</ion-menu>

然后在你的控制器中，导入 MenuController

import   MenuController   from 'ionic-angular';

public menuController:MenuController

menuController.enable(true,"mymenu");  //For Enabling
menuController.enable(false,"mymenu");  //For Disabling

【讨论】：

所以我传入了菜单的 ID，在你的情况下它是“mymenu”，对..