Question

我正在使用Thymeleaf（Spring Boot项目）。我有代码：

<div class="single_product_thumbnails">
    <ul>
        <li><img src="images/single_1_thumb.jpg" alt="" data-image="images/single_1.jpg"></li>
        <li class="active"><img src="images/single_2_thumb.jpg" alt="" data-image="images/single_2.jpg"></li>
        <li><img src="images/single_3_thumb.jpg" alt="" data-image="images/single_3.jpg"></li>
    </ul>
</div>

Th：src在左侧面板中加载图像缩略图（EL代码有效）。屏幕中心的数据图像加载图像 - 代码不起作用，即如果我使用data-image =“http：//image.png”或data-image =“images / single_2.jpg”它可以工作，但我的EL表达式没有不行。

原始代码（完全有效 - 来自https://colorlib.com/etc/coloshop/single.html）：

SELECT which, FLIGHT_NMBR, SCHEDULED_LAUNCH_DATE
FROM (SELECT F.*,
             (CASE WHEN to_date(scheduled_launch_date, 'DD-MON-YY') BETWEEN add_months(trunc(sysdate, 'MON'), 0) AND add_months(trunc(sysdate, 'MON'), 6)
                   THEN 'UPCOMING' ELSE 'PAST'
              END) as which
      FROM FLIGHTS F
     ) F
WHERE DATA_VERSION_NAME = 'WORKING' AND sequence_nmbr >= 0
ORDER BY (CASE WHEN which = 'UPCOMING' THEN 1 ELSE 2 END),
         (CASE WHEN which = 'UPCOMING' THEN SCHEDULED_LAUNCH_DATE END),
        sequence_nmbr;

如何在此数据图像示例中正确使用EL？提前感谢您的帮助。

Answer 1

Thymeleaf仅评估以th:为前缀的属性。你应该可以使用：

<div class="single_product_thumbnails">
    <ul>
        <li><img src="images/single_1_thumb.jpg" alt="" th:data-image="${product.mainImage}" /></li>
        <li class="active"><img src="images/single_2_thumb.jpg" alt="" th:data-image="${product.imageSecond}" /></li>
        <li><img src="images/single_3_thumb.jpg" alt="" th:data-image="${product.imageThird}" /></li>
    </ul>
</div>

另一个选项是使用th:attr来动态生成所需的属性。像这样：

<img src="images/single_1_thumb.jpg" alt="" th:attr="data-image=${product.mainImage}">

表达语言＆amp;数据图像 - 不显示图像

1 个答案: