Question

我希望做以下事情。这是可能的还是有解决方法？

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服务器端，但我认为这可能是更好的方式。

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

我需要一些基本数学公式的工具提示。

在myFragment.html中，我在table中有一个HTML th:cases，其中包含多个th:switch。每个td都有一个带有计算值的工具提示。

工具提示读取类似的内容，＆＃34;以下是我们计算您的自定义比率的方式：（（1 + 5）/ 3）+ 1 = 3＆＃34;，因此我们将其设置为可读取的样式更清楚。

在服务器端执行它会很麻烦，现在最好的选择是我避免使用th:fragment并在每个th:data-content字段中直接提供每个th:case中的逻辑}。

这似乎是一件小事，但令人惊讶的是，由于计算有时会发生变化，所以有点令人头疼，因此修改多个地方容易出错并且是一件苦差事。我们在多个地方做同样的事情。

Answer 1

我不知道有任何方法可以将片段作为文本获取，但是这里有一种方法可以用jquery来实现：

<td class="ms-rteTableEvenCol-0" style="width:25%;">
  <a href="/cs/supplyhub/Plants/Forms/AllItems.aspx">
    <img src="/cs/supplyhub/SiteAssets/Picture21.png" 
         alt="Picture21.png" style="margin:5px;width:200px;height:133px;">
  </a>
  <br>
</td>

html看起来像是：

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

在Chrome的开发者工具中渲染和检查html后，我可以看到：

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

Answer 2

您可以使用~{}而不是第一条评论中指定的${}添加模板。您的someObject未被评估的原因IMO是您没有使用变量类型表达式，即${someObject}

总体而言，您应该执行以下操作：

<强> 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

<div th:with="popoverContent = ~{myFragment :: myContent(${someObject})}">
    <th:block th:insert="${popoverContent}"></th:block>
</div>

使用片段作为thymeleaf变量th：with和th：data-content属性

2 个答案: