如何在 ionic2-angular2 中动态切换菜单的一侧？

Posted 2023-03-22

【中文标题】如何在 ionic2-angular2 中动态切换菜单的一侧？

【英文标题】：how can i switch the side of a menu dynamically in ionic2-angular2?

【发布时间】：2017-05-10 15:07:08

【问题描述】：

我在类中使用带有 sideMenu = left 或 right 的 ion-menu，当我们改变语言时它会改变。 sideMenu 变量发生了变化，但我不知道为什么侧面菜单没有。

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

我也尝试了另一种语法：[attr.side]="isRtl?'right':'left'"

它可以工作，但是当我将侧边菜单更改为右侧时：并且我打开菜单：它开始从左端到右侧，当我关闭它时：它执行相反的操作。 但如果我添加 type="push" 它不起作用。

希望任何人都可以帮助我。

【参考方案1】：

尚不支持动态切换侧边菜单（存在一些与此相关的未解决问题），但您可以通过添加两个侧边菜单来实现相同的效果，一个在右侧，一个在左侧

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

和

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

然后在代码中，根据选择的语言启用其中一个：

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');
        
    

【讨论】：

是的，我知道这种方法，但我不想复制我的代码。就是这样，但最后如果我找不到解决方案，我会这样做。反正 。感谢您的回复:)

是的，我明白，但似乎是目前唯一的方法。您可以在 this git issue 和所有与 rtl 相关的问题 here 中关注此功能的状态。