JSF 2中如何用convertNumber实现千分位(‰)的显示与输入转换？

嘿，这个问题我之前也碰到过，默认的JSF f:convertNumber确实只支持百分比，但我们可以用两种简单的方式来实现千分比（‰）的显示和输入转换，一起来看看~

1. 在h:outputText中显示千分比（比如把0.003转成3‰） #

这里有两种实用方案，按需选择：

方案一：EL表达式+f:convertNumber自定义格式 #

最快捷的方式就是直接对数值做乘法，再通过格式字符串添加千分比符号：

<h:outputText value="#{object.amount * 1000}">
    <f:convertNumber pattern="#,##0‰" />
</h:outputText>

• 原理：把0.003乘以1000得到3，再通过pattern="#,##0‰"给结果加上‰符号
• 如果需要保留小数，调整pattern即可，比如#,##0.00‰会把0.0123显示成12.30‰

方案二：自定义JSF转换器（适合全局复用） #

如果你的项目多处需要千分比转换，写一个自定义转换器更省心：

@FacesConverter("perMilleConverter")
public class PerMilleConverter implements Converter<Double> {

    @Override
    public String getAsString(FacesContext context, UIComponent component, Double value) {
        if (value == null) {
            return "";
        }
        // 可根据需求调整小数位数，这里默认取整
        return String.format("%.0f‰", value * 1000);
    }

    @Override
    public Double getAsObject(FacesContext context, UIComponent component, String value) {
        // 这个方法主要给输入框用，后面会详细说
        if (value == null || value.trim().isEmpty()) {
            return null;
        }
        // 移除‰符号，转成数字后除以1000
        String cleanValue = value.replaceAll("‰", "").trim();
        try {
            return Double.parseDouble(cleanValue) / 1000;
        } catch (NumberFormatException e) {
            throw new ConverterException(new FacesMessage("请输入有效的千分比数值"), e);
        }
    }
}

然后在outputText里直接引用转换器：

<h:outputText value="#{object.amount}" converter="perMilleConverter" />

2. 在h:inputText中实现输入转换（比如输入3→存储为0.003） #

这里直接用上面的自定义转换器就能实现双向绑定转换：

<h:inputText value="#{object.amount}" converter="perMilleConverter">
    <f:ajax event="blur" render="@this" /> <!-- 可选：失去焦点后自动格式化显示为带‰的样式 -->
</h:inputText>

• 用户输入3或3‰，转换器都会自动转成0.003存储到object.amount
• 页面加载时，object.amount的0.003也会自动显示成3‰，完美实现双向转换

如果需要更灵活的小数位数控制，可以给转换器加属性配置：

<h:inputText value="#{object.amount}">
    <f:converter converterId="perMilleConverter" />
    <f:attribute name="decimalPlaces" value="2" /> <!-- 指定保留2位小数 -->
</h:inputText>

然后修改转换器的getAsString方法读取这个属性：

@Override
public String getAsString(FacesContext context, UIComponent component, Double value) {
    if (value == null) {
        return "";
    }
    Integer decimalPlaces = (Integer) component.getAttributes().get("decimalPlaces");
    decimalPlaces = decimalPlaces != null ? decimalPlaces : 0;
    return String.format("%." + decimalPlaces + "f‰", value * 1000);
}

内容的提问来源于stack exchange，提问作者Cedric