RTF中的PrimeFaces菜单项

Question

我正在为我的应用程序开发两种语言菜单，第一语言是英语，第二语言是阿拉伯语。

英语没问题但是当我用RTL显示阿拉伯语菜单时，菜单名称显示成功，但所有子菜单项都显示在LTR中。

<h:form
        dir="#{session.getAttribute('user').locale=='en-US'?'ltr':'rtl'}">
        <p:panelMenu style="width:90%;"   >
            <p:submenu label="#{msg.ControlPanelMenu}"  
                rendered="#{userAuthneticator.authenticated}">
                <p:menuitem value="#{msg.AdministrationMenu}"    
                    action="/admin/index.xhtml" rendered="#{user.type==1}"
                    ajax="false" />
                <p:menuitem value="#{msg.TodayActivities}"
                    action="#{userActivity.prepareView()}" ajax="false" />
                <p:menuitem value="#{msg.ChangePasswordMenu}"
                    action="#{userUtils.prepareView()}" ajax="false" />
                <p:menuitem value="#{msg.ChangeLang}"
                    action="#{userUtils.changeLanguage()}" ajax="false" />
                <p:menuitem value="#{msg.LogoutMenu}"
                    action="#{userAuthneticator.logout()}" ajax="false"
                    onclick="if (!confirm('#{msg.ConfirmLogout}'))
                                return false" />
            </p:submenu>

这是RTL中菜单的display：

如何正确显示RTL中显示的菜单项？

感谢。

Answer 1

您可以将以下代码添加到您的页面。你需要通过操纵css手动完成它。

<p:outputPanel rendered="#{session.getAttribute('user').locale!='en-US'}">
    <style>
        .ui-panelmenu .ui-menuitem-text,.ui-panelmenu .ui-menuitem-text {
            float: right !important;
        }
    </style>
</p:outputPanel>