使用 th:text 来自 thymeleaf 的属性后，Materializecss 图标从 html 中消失答案

【问题标题】：Materializecss icons are disappearing from html after using th:text attribute from thymeleaf使用 th:text 来自 thymeleaf 的属性后，Materializecss 图标从 html 中消失
【发布时间】：2018-03-21 17:51:13
【问题描述】：

我目前正在学习使用 Spring 进行 Web 应用程序开发，在此期间我遇到了烦人的问题。

让我们进入正题。我正在使用materializecss，它允许通过以下方式制作一个带有图标的按钮：

<button class="waves-effect waves-light btn" type="submit" name="save">Send
    <i class="material-icons left">send</i>
</button>

我得到了一个带有图标的漂亮按钮： link

但是，一旦我添加了 thymeleaf 属性 th:text，它就会导致图标消失。

代码如下：

<button class="waves-effect waves-light btn" type="submit" name="save"
        th:text="#{submit}">Send
    <i class="material-icons right">send</i>
</button>

您知道可能是什么原因吗？

【问题讨论】：

标签： java spring-mvc thymeleaf materialize

【解决方案1】：

th:text 覆盖所有子标签。您必须将文本移动到它自己的标签。比如这样：

<button class="waves-effect waves-light btn" type="submit" name="save">
    <span th:text="#{submit}" />
    <i class="material-icons right">send</i>
</button>

【讨论】：

你是对的！现在它运行良好。谢谢你:)