根据 <h:outputText> 的值有条件地渲染 <div>

Question

我正在使用 jsf primefaces。我想根据特定 outputext 的值显示图像。如果文本值为 'Alarm *'，则 div 将出现在特定图像上。如果值为 'Alarm **'，则会出现带有其他图像的 div，等等。我尝试了下面的代码，但它对我不起作用。

<h:outputText id="alarmCriticalityValue" value="#{msg[summary.criticality.key]}" />

<c:if test="#{alarmCriticalityValue=='Alarm *'}">
   <div class="alarm1"></div>
</c:if>

我应该如何实现这个想法？

Answer 1

您需要使用 binding 属性将 UIComponent 实例放入 EL 范围。 id 属性不会这样做，这与您的预期相反。

<h:outputText binding="#{alarmCriticality}" ... />

然后需要使用UIOutput#getValue()获取其value属性

<c:if test="#{alarmCriticality.value == 'Alarm *'}">

也就是说，您最好在此处使用 rendered 属性，特别是如果 #{summary} 表示 JSF 迭代组件的当前迭代项，例如 <ui:repeat> 或 <h:dataTable> .

<h:panelGroup layout="block" styleClass="alarm1"
    rendered="#{alarmCriticality.value == 'Alarm *'}" />

另请参阅：

How does the 'binding' attribute work in JSF? When and how should it be used?
How to conditionally render plain HTML elements like <div>s?
JSTL in JSF2 Facelets... makes sense?

与具体问题无关。看到条件渲染依赖于本地化文本很奇怪。如果更改语言环境 and/or 本地化文本怎么办？这是非常脆弱的。您最好检查捆绑密钥。

<h:outputText value="#{msg[summary.criticality.key]}" />
<h:panelGroup layout="block" styleClass="alarm1" 
    rendered="#{summary.criticality.key == 'some.alarm.key'}" />

这样你也不需要再绑定输出文本了。

Answer 2

尝试

<c:if test="#{msg[summary.criticality.key].equals('Alarm *')}">

或者在 h:outputText 中添加 binding 并进行检查。

Answer 3

试试这个

<h:outputText id="alarmCriticalityValue" value="#{msg[summary.criticality.key]}" />
    <h:panelGroup layout="block" styleClass="alarm1" rendered="#{alarmCriticality.value eq 'Alarm *'}" />

根据 <h:outputText> 的值有条件地渲染 <div>

Conditionally render a <div> based on value of <h:outputText>

jsf

conditional-rendering

另请参阅：