JSP 到 Facelets 相当于数据库在循环中提供 URL 链接

Question

我正在将 servlet/jsp Netbeans 的 Affableben 教程移植到 JSF 框架，并希望使用 Facelets 作为视图。

我已经有了 JPA 实体、会话 Bean 和托管 Bean。我从视图开始。但是，我还没有在 Facelets 中找到等效的方法来解决这一行：

<a href="<c:url value='category?${category.id}'/>">

这是完整的循环，无论是在 jsp 中还是在 Facelets 中：

JSP 代码：

<c:forEach var="category" items="${categories}">
    <div class="categoryBox">
        <a href="<c:url value='category?${category.id}'/>">
            <span class="categoryLabel"></span>
            <span class="categoryLabelText"><fmt:message key='${category.name}'/></span>

            <img src="${initParam.categoryImagePath}${category.name}.jpg"
                 alt="<fmt:message key='${category.name}'/>" class="categoryImage">
        </a>
    </div>
</c:forEach>

等效的 Facelets 代码：

<ui:repeat var="category" value="${categoryController.items}">
    <div class="categoryBox">
        <h:link outcome="${category.id}"/>
        <span class="categoryLabel"></span>
        <span class="categoryLabelText">${category.name}</span>

        <img src="./resources/img/categories/${category.name}.jpg"
                 alt="${category.name}" class="categoryImage"/>

    </div>
</ui:repeat>

此行在 Facelets 中无法按预期工作：

<h:link outcome="${category.id}"/>

What would be aworking Facelets 中的等价物？

编辑1

public String getName() throws UnsupportedEncodingException {
    return URLEncoder.encode(name, "UTF-8");
}

警告消息：无法找到资源img/categories/fruit+%26+veg.jpg

Answer 1

利用 JSF 隐式导航并需要真实（隐式）导航结果值。您需要在结果中指定视图 ID。您需要通过指定请求参数。您还需要将跨度和图像嵌套在链接中，就像在最初的示例中所做的那样。假设您的根目录中有一个 category.xhtml 文件，则应该这样做：

<h:link outcome="category">
    <f:param name="id" value="#{category.id}" />

    <span class="categoryLabel"></span>
    <span class="categoryLabelText">#{category.name}</span>
    <img src="./resources/img/categories/#{category.name}.jpg"
             alt="#{category.name}" class="categoryImage"/>
</h:link>

---

与具体问题无关，您应该使用 也代替 。这样 JSF 将确保正确设置 src。在您的特定情况下，这将是

<h:graphicImage name="img/categories/#{category.name}.jpg"
    alt="#{category.name}" class="categoryImage"/>

（请注意，我将 ${} 替换为 #{}，只是为了遵守标准并保持一致性）

Answer 2

您可以从这一行：更改

<a href="<c:url value='category?${category.id}'/>">

为：

<h:link outcome="category.xhtml?id=#{category.id}" />
<h:link outcome="category">
   <f:param name="id" value="#{category.id}" />
</h:link>
<h:outputLink value="category.xhtml?id=#{category.id}" ></h:outputLink>