I am trying to use a single menu for both LTR and RTL but the issue I am facing when its RTL then the menu is opening from the left side which should be from the right side
I don't believe you can use a single menu for both RTL and LTR swiping behavior. You could instead, use a service that would populate the menu information with a *ngIf=let link of links"
, and then just have a menu on either side of the app that subscribes to the links provided in the service.
The attribute side="end"
or side="start"
controls which side of the app the menu will appear on, so if you want to swipe from the right side of the screen you'd use slide="end"
on your ion-menu
.
<ion-menu side="end" contentId="mainContent" menuId="slidingMenu" id="slidingMenu">
<ion-header>
<ion-toolbar>
<ion-title>{{(menu?.details | async)?.title}}</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-item class="item-mute">
<ion-label>Mute</ion-label>
<ion-toggle></ion-toggle>
</ion-item>
<ion-item *ngFor="let link of (menu?.details | async)?.links" detail
(click)="navToPage(link)">{{link?.title}}</ion-item>
</ion-list>
</ion-content>
</ion-menu>