如何将菜单的方向更改为 RTL ionic2.

Question

ionic version 3.3.0：

<ion-menu [content]="Menu"
          [class.rtl]="isRtl"
          [attr.side]="isRtl?'right':'left'">
</ion-menu>

我根据用户选择的语言改变方向，它工作正常，除非菜单更改为 RTL 方向 ，菜单从左到右打开(如动画(，并且从左到右滑动。请注意，我不想复制我的菜单，一个用于 rtl，一个用于 ltr，因为它也不适用于新版本 3.3.0

Answer 1

this.menu._type = null; 

更新菜单侧后，将menu._type设置为 null，以便重新计算新平台方向的动画。

Answer 2

我通过使用 CSS 的解决方法解决了它，我做了两个菜单，一个用于 RTL 侧(右(，另一个用于 LTR(左(我将以下内容添加到 app.scss 文件中：

[dir="rtl"]{
  ion-menu[side=right] > .menu-inner {
    right: 0;
    direction: ltr;
  }
  ion-menu[side=right] ion-icon[aria-label^="arrow"]::before, ion-icon[flip-rtl]::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    margin-left: 8px;
  }
}

并更改 dir 属性 (rtl ot ltr(从 html 标记 ： 当您需要时：

this.platform.setDir('rtl',true);