CODEWITHSUNDEEP
ionic-frameworkionic3
Ande Caleb
Ande Caleb

Reputation: 1204

How to disable Sidemenu on certain pages Ionic 2

i am building a project with ionic 3, and the first 3 pages use the blank ionic template, because it has to do with login, registration and then verification, and afterwards you enter the applications home page, which then i utilized the sidemenu ionic template

i have succeeded in building the application and everything works, but after adding the sidemenu templates it affects the blank templates, if you slide left on the screen the side menu shows.. this is my code..

on the 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>

on the verify account view template i have this

<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>

i removed the menutoggle button but if you slide on those pages, this is what i did 

     <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>

but yet to no avail, please is there something i was supposed to do, or is not doing? thanks in advance.

Upvotes: 0

Views: 49

Answers (1)

ashirwadrk
ashirwadrk

Reputation: 126

You can enable/disable the sidemenu from your controller like below

<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>

And then in your controller, import MenuController

import {  MenuController  } from 'ionic-angular';

public menuController:MenuController

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

Upvotes: 0

Related Questions