2

有什么方法可以使用 Thymeleaf 制作复合组件（比如在 JSF 中）？我发现了如何将参数发送到可以使用表达式语言检索的片段。但是我还没有想出如何像在 JSF 中那样将标记发送到片段。

例如，我有几个页面在左侧有非常相似的菜单。我希望能够在我的所有页面上使用单个片段，但传递一些标记以显示在菜单底部。有些页面必须在底部显示文本，有些页面必须显示文本，例如，它实际上比这更复杂。

<div class="menu" th:frament="menu">
    <a th:text="${menuItem1}"></a>
    <a th:text="${menuItem2}"></a>
    <a th:text="${menuItem3}"></a>
    <markup sent as parameter /> <!-- how do I do this? -->
</div>



<div th:substitueBy="template :: menu" th:with="menuItem1=item1, menuItem2:item2, menuItem3:item3">
    <markup to be sent as parameter /> <!-- this does not work -->
</div>
4

2 回答 2

1

我还想创建具有可交换内容的复合组件。这就是我开发thymeleaf-component-dialect的原因。

使用这种方言，您可以编写如下组件：

创建一个带有<tc:content/>标签的组件（一个百里香叶片段）

<div th:frament="menu">
    <a th:text="${menuItem1}"></a>
    <a th:text="${menuItem2}"></a>
    <a th:text="${menuItem3}"></a>
    <tc:content></tc:content>
</div>

使用组件

<tc:menu>
    <h1>Some Header</h1>
    <p>Lorem ipsum dolor sit amet</p>
</tc:menu>

结果将是

<div>
    <a>Menu Item 1 Text</a>
    <a>Menu Item 2 Text</a>
    <a>Menu Item 3 Text</a>
    <h1>Some Header</h1>
    <p>Lorem ipsum dolor sit amet</p>
</div>

方言是新的，仍处于 alpha 状态。欢迎反馈。

于 2017-09-22T08:45:54.240 回答
0

你可以这样做：

但是您必须将所有菜单容器属性写入您使用它的每个页面。

我不太喜欢这种方式，但我认为它应该有效：p

模板：

<div th:frament="menu">
    <a th:text="${menuItem1}"></a>
    <a th:text="${menuItem2}"></a>
    <a th:text="${menuItem3}"></a>
</div>

页：

<div class="menu">
    <div th:include="template :: menu" 
         th:remove="tag" 
         th:with="menuItem1=item1, menuItem2:item2, menuItem3:item3" />
    <more markup/>
</div>
于 2013-06-21T08:25:00.143 回答