jsf-2 - 如何使用ui :repeat tag在dataTable中动态生成id

Question

我正在使用渲染图像的 ui:repeat 标签。我有五个图像，我希望在每次迭代中我的图像都获得像 image1、image2、image3 .... imagen 这样的 ID。我试过了，但没有用。

<div id="imageGallery">
    <ui:repeat value="#{countryPages_Setup.images}" var="image" varStatus="status">
        <tr>
            <td>
                <a href="javascript:void()" class="launchLink">
                    <p:graphicImage id="image#{status.index}"         //problem
                                    value="/resources/images/#{image}"
                                    width="100"
                                    height="100"
                                    rendered="#{countryPages_Setup.renderImages}"/>
                </a>
            </td>
        </tr>
    </ui:repeat>
</div>

我也试过 {staus.index + 1}。我也试过 id= image#{1++} 但它也不起作用。我该怎么做？

谢谢

Answer 1

您可以在 id 中使用 EL属性，但它必须在 View 构建期间可用。 <ui:repeat>但是在 View 渲染期间运行，它将重用相同的 <p:graphicImage>生成多个 HTML <img>元素。它不会在 View 构建期间运行，因此 id遗迹 image .

如果你替换<ui:repeat>通过 <c:forEach> ，然后它将按您的意图工作。 <c:forEach>在 View 构建期间运行，它将生成多个 <p:graphicImage>然后每个组件只渲染一次。

<div id="imageGallery">
    <c:forEach items="#{countryPages_Setup.images}" var="image" varStatus="status">
        <tr>
            <td>
                <a href="javascript:void()" class="launchLink">
                    <p:graphicImage id="image#{status.index}"
                                    name="images/#{image}"
                                    width="100"
                                    height="100"
                                    rendered="#{countryPages_Setup.renderImages}"/>
                </a>
            </td>
        </tr>
    </c:forEach>
</div>