HTML 元素未在 Thymeleaf 条件元素内呈现

Question

这是我第一次使用 thymeleaf，如果用户输入了错误的凭据，我将使用 Spring 将 flash 属性返回到登录页面。 显示错误消息（2 个div ），但不呈现内部的<span class="closeBtn"> 。

源代码

<div th:if="${message}" class="row">
    <div th:text="${message}" th:class="${'col s8 offset-s2 m6 offset-m3 alert ' + alertClass}">
        <span class="closebtn">&times;</span>
    </div>
</div>

消息右侧应该有一个“x”。 我打开了浏览器检查器，它也没有显示在 HTML 中。

浏览器检查器代码

<div class="row">
    <div class="col s8 offset-s2 m6 offset-m3 alert error">Incorrect username / password.</div>
    ::after
</div>

Answer 1

基本上<span class="closebtn">&times;</span>被th:text="${message}"覆盖。 解决方案是使用th:utext并添加<span class="closebtn">&times;</span>以及您的错误消息。
即在属性文件中定义属性，如view.error=Incorrect username/password. <span class="closebtn">&times;</span> view.error=Incorrect username/password. <span class="closebtn">&times;</span>并像这样使用它

<div th:text="#{view.error}" th:class="${'col s8 offset-s2 m6 offset-m3 alert ' + alertClass}"></div>

希望这会有所帮助。