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

时间:2018-12-31 11:49:11

标签: ionic-framework ionic3

我正在使用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>

但仍然无济于事,请问我应该做的事还是不做的事?预先感谢。

1 个答案:

答案 0 :(得分:0)

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

<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