title: Ionic toggle menu doesn't close side menu on android device
body: <p>I have an Ionic 4 project and I'm using a side menu. There's a menu button that opens the menu, and in the menu is a list of menu-choices, when selected the menu-choice closes the side menu. This works in a browser, but not on a device. The menu will open, but not close. </p>
  
  <p>My side menu is in my app.component.html</p>
  
  <pre><code>&lt;ion-app&gt;
    &lt;ion-menu side="start" type="push" contentId="content1"&gt;
        &lt;ion-header&gt;
          &lt;ion-toolbar color="primary"&gt;
            &lt;ion-title&gt;Menu&lt;/ion-title&gt;
          &lt;/ion-toolbar&gt;
        &lt;/ion-header&gt;
        &lt;ion-content class="light-grey"&gt;
          &lt;ion-list&gt;
            &lt;ion-item (click)="toggleMenu()" [routerLink]="['/home']" routerLinkActive="active-link"&gt;Home&lt;/ion-item&gt;
            &lt;ion-item (click)="toggleMenu()" [routerLink]="['/dashboard']" routerLinkActive="active-link"&gt;Dashboard&lt;/ion-item&gt;
          &lt;/ion-list&gt;
        &lt;/ion-content&gt;
      &lt;/ion-menu&gt;
      &lt;ion-router-outlet id="content1" main&gt;&lt;/ion-router-outlet&gt;
  &lt;/ion-app&gt;
  </code></pre>
  
  <p>Here is a sample of the homepage</p>
  
  <pre><code>&lt;ion-header&gt;
      &lt;ion-toolbar&gt;
          &lt;ion-buttons slot="start"&gt;
              &lt;ion-menu-button autoHide="false" menuToggle&gt;&lt;/ion-menu-button&gt;
            &lt;/ion-buttons&gt;
          &lt;ion-title&gt;
           Opportunity Forms
          &lt;/ion-title&gt;
      &lt;/ion-toolbar&gt;
    &lt;/ion-header&gt;
  
  &lt;ion-content&gt;
    &lt;ion-refresher slot="fixed"  (ionRefresh)="ionRefresh($event)" &gt;
        &lt;ion-refresher-content 
            pulling-icon="arrow-dropdown"
            pulling-text="Pull to refresh"
            refreshing-spinner="circles"
            refreshing-text="Refreshing..."&gt;
        &lt;/ion-refresher-content&gt;
      &lt;/ion-refresher&gt;
    &lt;ion-card&gt; 
        &lt;ion-card-content&gt;
  
  
        &lt;/ion-card-content&gt;
      &lt;/ion-card&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>Here is a screenshot of the app</p>
  
  <p><a href="https://i.stack.imgur.com/HO9qz.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/HO9qz.jpg" alt="enter image description here"></a></p>
  
  <p>Works in Chrome Version 77.0.3865.90
  Tested and menu does not close on Android 9</p>
  
  <p>Any help is appreciated, hopefully I've provided enough information. </p>
  
  <p>-- Edit (adding app.component.ts) --</p>
  
  <pre><code>import { Component } from '@angular/core';
  
  import { Platform } from '@ionic/angular';
  import { SplashScreen } from '@ionic-native/splash-screen/ngx';
  import { StatusBar } from '@ionic-native/status-bar/ngx';
  import {MenuController} from '@ionic/angular';
  import { Router } from '@angular/router';
  
  @Component({
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.scss']
  })
  export class AppComponent {
    constructor(
      private platform: Platform,
      private splashScreen: SplashScreen,
      private statusBar: StatusBar,
      private menu: MenuController,
      private route: Router
    ) {
      this.initializeApp();
    }
  
    initializeApp() {
      this.platform.ready().then(() =&gt; {
        this.statusBar.styleDefault();
        this.splashScreen.hide();
      });
    }
    toggleMenu() {
      this.menu.toggle(); //Add this method to your button click function
    }
  }
  </code></pre>