【问题标题】:How to disable Sidemenu on certain pages Ionic 2如何在某些页面上禁用 Sidemenu 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后显示的是哪个@

标签: ionic-framework ionic3


【解决方案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”,对..
猜你喜欢
  • 2016-06-11
  • 2016-12-03
  • 2016-08-11
  • 2021-08-09
  • 2010-11-06
  • 1970-01-01
  • 1970-01-01
  • 2013-06-07
  • 1970-01-01
相关资源
最近更新 更多