Ionic v4 - menu isn't closing/hiding

Ionic Version : 4
i am facing this problem in model : Motorla G series having Marshmello OS.

code inside menu.page.html…

<ion-split-pane>
  
  <ion-menu contentId="content">
    <ion-content>
      <br><br>
      <div class="ion-text-center menu-header">
        <img src="/assets/white-logo.png">
      </div>
      <br><br>
      <ion-list lines="none" >
        
        <!-- fix pages -->
        <ion-item routerDirection="root"  color="transparent" detail="true" *ngFor="let p of pages" [routerLink]="p.url" [class.active-item]="selectedPath === p.url" (click)="closeMenu()">
          <ion-icon name="{{ p.icon }}" slot="start"></ion-icon>
          <ion-label >{{ p.title }}</ion-label>
        </ion-item>
       
        <!-- dynamic pages from server CMS -->
        <ng-container *ngIf="_gs.pages.length>0">
              <ion-item *ngFor="let p of _gs.pages" routerDirection="root" [routerLink]="['/menu/common', p.id]"  color="transparent"  detail="true" (click)="closeMenu()">
                <ion-icon name="{{ p.icon }}" slot="start"></ion-icon>
                <ion-label >{{ p.name }}</ion-label>
              </ion-item>
        </ng-container>

      </ion-list>
    </ion-content>
  </ion-menu>
  <ion-router-outlet id="content" main></ion-router-outlet>
</ion-split-pane>

After selecting item, menu usually gets close/hide in other devices but in this it’s not hiding in this device.

even i used closeMenu() to force fully close that menu but still its not closing/hiding.

code inside menu.page.ts is like below

import { MenuController } from '@ionic/angular';
.....
constructor(private menu:MenuController) { .. } 
.....
closeMenu() {
    this.menu.close(); //force full close the menu
  }