如何使用Model和Thymeleaf为iframe src与href属性动态添加链接
问题原因
占位符未正常填充、程序报错的核心原因是Thymeleaf语法使用错误:
- 模板未声明Thymeleaf命名空间,引擎无法识别对应语法
- Thymeleaf不会直接解析原生HTML属性(如
src、href)内的${}占位符,必须通过th:前缀的自定义属性声明动态值,渲染时引擎会自动计算表达式结果,替换为对应的原生属性值。
你的后端Controller代码逻辑没有问题,Model中传入的属性可以直接在模板中读取。
修复步骤
- 在模板根标签
<html>上添加Thymeleaf命名空间声明 - 将原生的
src、href属性替换为th:src、th:href,在Thymeleaf属性中编写取值表达式 - 确认
myHome.html文件存放在项目resources/templates目录下,且项目已正确引入Thymeleaf依赖
修正后的完整模板代码:
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>exchange</title> </head> <body> <iframe th:src="${baseUrl}" width="980" height="560" frameBorder="0" class="giphy-embed" allowFullScreen></iframe> <p><a th:href="${embedUrl}"></a></p> </body> </html>
额外提示:如果需要拼接URL参数,推荐使用Thymeleaf标准链接语法
@{},例如th:href="@{${embedUrl}(code=${code})}",该语法会自动完成URL编码,避免特殊字符导致的链接异常。
内容的提问来源于stack exchange,提问作者Alpharius
相关产品推荐
相关产品推荐

