Thymeleaf - 从 javascript 设置资源消息

Question

我正在使用 thymeleaf。 首次打开页面时显示资源消息没有问题。 但是，当我想在 ajax 请求之后重新渲染 select 的内部时，我遇到了问题。

Html（第一次加载）：

<select onchange="destLangChanged()" class="no-round-input-bg" id="destLang">
    <option value="en" th:utext="#{lang.en}"></option>
    <option value="fr" th:utext="#{lang.fr}"></option>
</select>

Javascript侧：

var $el = $("#destLang");
$el.empty(); // remove old options
$el.append($("<option></option>")
.attr("th:utext", "[[#{lang.en}]]").attr("value", '#{lang.en}'));

如您所见，我尝试了两种不同的方法，没有“[[#{}]]”和“#{}”。

在这段代码的末尾，我期望 '#destLang' 被清空并从资源中添加 lang.en 的值。 但结果如下。添加了选项但资源消息显示不正确

感谢您的帮助。

Answer 1

扩展@connexo 的评论。

让我们先想想，什么是 thymeleaf 以及它是如何工作的。 Thymeleaf is a templating language which can bind values (both way, HTML to Java object, Java object to HTML). 这些模板文件存储在资源文件夹中，每当客户端要求这些文件时，服务器使用必要的 java 对象运行这些模板以解析最终的 HTML。 在最终生成的 HTML 中，您永远不会看到 thymeleaf 属性。 浏览器不理解这些属性。 所以 thyemleaf 属性在服务器端解析。

因此，您添加的这些 thymeleaf 属性没有被服务器端解析，这就是为什么在 javascript 中这样做并没有像在修改原始模板文件时那样反映。

希望它能对你的问题有所启发。

Answer 2

通常，使用默认的 Spring Boot/Thymeleaf 应用程序，您可以使用..?lang=fr更改使用的区域设置。 因此，您可以添加如下内容，而不是尝试在 JavaScript 中执行某些操作：

<a th:href="@{/(lang=en)}">English</a>
<a th:href="@{/(lang=fr)}">Français</a>