使用片段作为 th:with 和 th:data-content 属性的 Thymeleaf 变量

2024-06-02

我想做如下的事情。这可能吗?或者有解决方法吗?

myFragment.html

<div th:fragment="myContent(someObject)">
  Some popover strings with some business logic
  <span th:text="${someObject.property}">[object property]</span>
</div>

myTemplate.html

<!-- how would I correct this so that the fragment is evaluated? -->
<div th:with="popoverContent = ${myFragment :: myContent(someObject)}">    
    <a th:data-content="${popoverContent}"></a>
</div>

我可以在一个片段中插入一个片段吗?th:with作为变量?我可以创造popoverContent服务器端,但我认为可能有更好的方法。

更新:有关用例的更多细节

我需要带有一些基本数学公式的工具提示来设计样式。

In myFragment.html,我有一个 HTMLtable与多个th:cases in a th:switch. Each td有一个带有计算值的工具提示。

工具提示内容类似于“我们计算您的自定义比率的方式如下:((1 + 5) / 3) + 1 = 3”,因此我们将其样式设置为更清晰地阅读。

在服务器端执行此操作会很混乱,现在最好的选择是避免使用th:fragment并提供每个中的逻辑th:data-content直接在每个字段中th:case.

这看起来是一件小事,但令人惊讶的是,它有点令人头疼,因为计算有时会发生变化,因此修改多个位置很容易出错,而且很麻烦。我们在多个地方总体上做同样的事情。


我不知道有什么方法可以将片段作为文本获取,但这是使用 jquery 实现的一种方法:

<!-- onload -->
<script>
    $(function() {
        $('#dest').attr('data-content', $('#source').html());
    });
</script>

html 看起来像这样:

<div id="dest"></div>
<div id="source" style="display: none;" th:insert="~{popover :: popover}" />

在 Chrome 开发者工具中进行渲染并检查 html 后,我可以看到:

<div id="dest" data-content="<div>Hello, I am a popover</div>"></div>
<div id="source" style="display: none;"><div>Hello, I am a popover</div></div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用片段作为 th:with 和 th:data-content 属性的 Thymeleaf 变量 的相关文章

随机推荐

  • file_get_contents,HTTP 请求失败

    我尝试使用以下方式从另一个网站获取内容file get contents但我总是收到 无法打开流 HTTP 请求失败 allow url fopen 已打开 并且我已经在防火墙关闭的情况下进行了测试 但还是会出现这种情况 请问还有什么原因呢
  • Asyncio 中的无限循环或“递归”

    我是 Python3 asyncio 的新手 我有一个函数可以不断地从 websocket 连接检索消息 我想知道我是否应该使用while True循环或asyncio ensure future以递归方式 哪个是首选还是不重要 Examp
  • 错误:-march= 开关的值错误

    我写了一个Makefile 但无法让它工作 我有一个选项应该选择编译到哪个处理器 然而 当我跑步时make从命令行它说 tandex tandex P 6860FX emulators nintendo sdks 3DS SDK HomeB
  • 如何将对象(模型类型对象)插入到 Laravel 中 Collection 对象的特定索引号处?

    我读过戴尔 里斯的代码明亮 https daylerees com codebright 了解更多关于雄辩的信息Collection在 Laravel 中使用 还做了一些其他研究 但找不到我正在寻找的答案 我想插入一个对象 Model输入对
  • 找出 CPU 时钟频率(每个内核、每个处理器)

    像 CPUz 这样的程序非常擅长提供有关系统的深入信息 总线速度 内存时序等 但是 是否有一种编程方法可以计算每个核心 以及每个处理器 在每个 CPU 具有多个核心的多处理器系统中 频率 而无需处理 CPU 特定信息 我正在尝试开发一个反作
  • 无法使用动态布局使用 Gradio 音频输入进行录制

    我想创建一个界面gradio我有一个最初隐藏的音频输入 经过一些步骤后 例如收到指令后 用户可以录制音频 但是当我使音频输入可见时 它无法录制 import gradio with gradio Blocks as interface re
  • malloc :匿名映射和魔法区域

    我只是在摆弄内存映射 想查看用户空间虚拟内存区域映射 写了一些像这样的行 char ptr NULL printf Allocating 300KB n ptr malloc 300 1024 printf Allocated at p s
  • 以编程方式更改 iPhone 背景

    是否可以通过代码更改 iPhone 背景 如果你写一个新的png到 User Library LockBackground png然后打电话notify post com apple language changed 设备将重新启动 并且您
  • 将输入数据发送到node.js中的子进程

    我正在编写代码以在 Node js 环境中创建在线 C 编译器 使用spawn函数我创建了一个子进程 它将编译代码并执行它并将输出发送回用户 但我需要将输入发送到正在运行的 C 程序 我用了child stdin write data 用于
  • 竹子 - 构建我的拉取请求

    当拉取请求进入 git 时 我试图触发竹子中的构建 我可以将 webhook 信息发送到竹子 但它不是构建适当的 sha 标记的签入 而是构建 主 分支 这是否需要对竹子进行一些自定义 git 设置 到目前为止我还没有看到任何简单的事情 在
  • Fortran 意图(inout)与省略意图

    良好的实践表明 Fortran 中的子例程参数每个都应具有指定的意图 即intent in intent out or intent inout 如上所述这个问题 https stackoverflow com questions 1011
  • 想要在 jaxb2-maven-plugin 生成的类中使用 @XmlRootElement

    我有一组从 WSDL 生成的 Java 类 它们运行良好 我正在为我正在使用的另一个 Web 服务添加另一个 WSDL 到项目中 但我在第二个 WSDL 生成的类中没有得到 XmlRootElement 注释 并且不明白为什么不这样做 这是
  • 蓝牙 4.0 与较旧的蓝牙

    我正在尝试使用蓝牙 4 0 模块实现一个应用程序 我想知道将此应用程序与包含简单蓝牙 2 1 EDR 模块的 Iphone 3GS 一起使用是否能让我利用 4 0 模块中的低功耗 谢谢您的回答 蓝牙 4 0 是标准 其中包括经典蓝牙基本速率
  • 在 AngularJS 中使用单个输入过滤多个字段

    我有一个 JSON 对象 如下所示 id 1 firstName Jennifer middleName null lastName Aniston address New York City id 2 firstName Angelina
  • Gnuplot:在某一点用线连接两个数据

    我想要一个使用 gnuplot 的图表 其中包含混合方案中的两个数据 这是一个由 3 列组成的数据 x y1 y2 1 0 1 2 0 1 3 0 1 4 0 1 5 0 1 6 0 1 7 0 1 8 0 1 9 0 1 1 2 10 0
  • 跳转目的地太远:3 个字节

    我的循环有问题 其中包含的代码很长并且给了我错误jump destination too far by 3 byte s 当我删除时 mov edx offset str1 call writestring 这部分位于主过程下方 它不会给出
  • YouTube API v3 不返回任何项目

    一周前 我开始使用 YouTube API v3 并且能够使用以下 URL 从 API 检索 13 个项目 https www googleapis com youtube v3 search key MyKey channelId ACh
  • 客户端 Blazor 身份验证令牌在服务器端过期

    我在使用 Blazor 身份验证时遇到客户端令牌问题 我根据这篇博客文章实现了身份验证 我正在使用 webAssembly 项目 https chrissainty com secure your blazor apps introduct
  • 在 SpecFlow 测试中使用 ChromeDriver

    因此 正如我们所知 当您使用 SpecFlow 时 如果您重复使用另一个测试中的步骤 它会自动将其拉入并重复使用 但是 我遇到了一个问题 测试 A 登录我 测试 B 登录并确认主页是正确 但当我开始使用测试 B 时 测试 A 正在初始化 C
  • 使用片段作为 th:with 和 th:data-content 属性的 Thymeleaf 变量

    我想做如下的事情 这可能吗 或者有解决方法吗 myFragment html div Some popover strings with some business logic span object property span div m