CODEWITHSUNDEEP
angularionic2ionic3
Joe Sleiman
Joe Sleiman

Reputation: 2496

how can i switch the side of a menu dynamically in ionic2-angular2?

i'm using ion-menu with sideMenu = left or right inside the class , it change when we change the language. the sideMenu variable change but i don't know why the side menu don't .

<ion-menu [content]="mifonMenu"
          [side]="sideMenu"
          >

i also try another syntax : [attr.side]="isRtl?'right':'left'"

it woks, but when i change the side menu to right : and i open the menu : it start coming from end of left to the right and when i close it : it do the inverse. but if i add type="push" it not works.

hope anyone can help me .

Upvotes: 2

Views: 458

Answers (1)

sebaferreras
sebaferreras

Reputation: 44669

Switching the side menu dynamically is not yet supported (there're a few open issues related to this) but you can achieve the same by adding two side menus, one in the right and one in the left

<ion-menu [content]="mifonMenu" id="left-menu" side="left">...</ion-menu>

and

<ion-menu [content]="mifonMenu" id="right-menu" side="right">...</ion-menu>

And then in the code, enable one of them according to the selected language:

import { MenuController, ...';

@Component({
    templateUrl: 'app.html'
})
export class MyApp {

    constructor(private menuCtrl: MenuController, ...) {}

    public yourMethod(): void {
        if (this.selectedLanguage.rtl) {
            this.menuCtrl.enable(true, 'right-menu');
            this.menuCtrl.enable(false, 'left-menu');
        } else {
            this.menuCtrl.enable(false, 'right-menu');
            this.menuCtrl.enable(true, 'left-menu');
        }
    }
}

Upvotes: 1

Related Questions