xpages应用程序布局控制html标签

Question

我需要自定义标准应用程序布局控件生成的输出，例如向标签添加HTML代码（例如，指定嵌套标签的fa图标）：

<xe:this.configuration>
            <xe:simpleResponsiveConfiguration>
                <xe:this.navbarUtilityLinks>
                    <xe:basicLeafNode>
                        <xe:this.label><![CDATA[<i class="fa fa-bell">Notification(s)</i>]]></xe:this.label>
                    </xe:basicLeafNode>
                </xe:this.navbarUtilityLinks>
            </xe:simpleResponsiveConfiguration>
        </xe:this.configuration>
    </xe:applicationLayout>

不幸的是，显示的输出没有转义，结果是

<i class="fa fa-bell">Notification(s)</i>

而不是 通知（S）。 有没有办法为应用程序布局控件中的选项标签设置escape =“false”/“true”？

Answer 1

树节点在这方面有点受限。它们的设计不能在渲染输出中添加额外的html。你曾尝试使用label属性在那里破解它，但这将永远被转义。

史蒂夫建议将fa fa-bell设置为节点本身的styleClass。它会显示图标和文本，但会混淆标签文本的字体样式。如果你改变标签的字体，它会弄乱图标，因为它们都是同一个DOM元素的一部分。

但是，在ToDo示例应用程序（现在是ExtLib发行版的一部分）中，有一个在simpleLayout自定义控件中使用jQuery执行所需操作的示例。它在XPage的onClientLoad事件期间添加了图标。如果您重新编写该代码，可以使用它来执行您想要的操作：

<xp:eventHandler event="onClientLoad" submit="false">
    <xp:this.script><![CDATA[
        $(".applayout-utility-links li:nth-child(1) a").prepend("<i class='fa fa-bell' style='margin-right:5px'></i>")]]>
    </xp:this.script>
</xp:eventHandler>