2016-06-01 7 views
2

私はthymeleaf断片を取ってその中のすべての内容を使いたいが、それを消費するページから余分な内容を追加することもある。典型的なケース:すべてのページに必要なスクリプトのrefを含むフッタテンプレートがあります。いくつかのページでは、私は別のスクリプトrefを追加したいが、すべてではない。置き換えるのではなく、どのようにThymeleafの断片に「追加」するのですか

私は私のWebアプリケーションでは、次のセットアップ(ポイントに集中する複雑さの低減)があります。

layout.html:

<html> 
    <body> 
     <div class="container"> 
      <div fragment="content"></div> 
     </div> 
     <div th:replace="shared/footer :: footer"></div> 
    </body> 
</html> 

共有/ footer.html

<html> 
    <body> 
     <div th:fragment="footer" th:remove="tag"> 
      <script th:src="{@/scripts/a.js}"></script> 
     </div> 
    </body> 
</html> 

をindex.html

<html> 
    <body> 
     <div th:fragment="content" class="myClass"> 
      <h1>Oh hello</h1> 
     </div> 

     <!-- what do i put here?!!! --> 
    </body> 
</html> 
私がやりたい何10

はindex.htmlをから、フッターにいくつかの余分なコンテンツを追加することができます:

例:

<html> 
     <body> 
      <div class="container"> 
       <div class="myClass"> 
        <h1>Oh hello</h1> 
       </div> 
      </div> 
      <div> 
       <script src="/scripts/a.js"></script> 
       <script src="/scripts/b.js"></script> 
      </div> 
     </body> 
    </html> 

<div th:addExtraStuff="footer"> 
    <script th:ref="@{scripts/b.js"></script> 
</div> 

ので、最終的な結果は次のようになります

明らかにth:addExtraStuffは存在しませんが、あなたはそのアイデアを得ます。私は既存のコンテンツを望み、私自身のコンテンツを提供することができます。フラグメントにすべての可能性を置き、評価を使用して実際にその可能性を含めるかどうかを判断すると、複雑になり始めると思います。私は間違っている可能性があります。

答えて

1

私がこれを解決したのは、カスタム方言を使用せずに、私が「メインレイアウト」と呼ぶレイアウトテンプレートとして使用するフラグメント上の引数を使用することです。この例では、オーバーライドする必要のない要素は除外できますが、提供するものは 'main-layout'の部分に追加されます。

基本的なテンプレートはこの

メインview.html

<!DOCTYPE html> 
    <html lang="en" xmlns:th="http://www.thymeleaf.org" th:fragment="main-layout"> 
    <head> 
     <title>Template Head Title</title> 
     <th:block th:replace="${head} ?: ~{}" /> 
    </head> 
    <body> 
     <header> 
      Common Template Header Here 
      <th:block th:replace="${contentHeader} ?: ~{}" /> 
     </header> 
     <main> 
      Common Template Content Here 
      <th:block th:replace="${content} ?: ~{}" /> 
     </main> 
    </body> 
    <footer> 
     Common Template Footer Here 
     <th:block th:replace="${footer} ?: ~{}" /> 
    </footer> 
</html> 

そして、それは私がカスタムを使用せずに、これを解決してきました

<!DOCTYPE HTML> 
<html th:replace="main-view.html :: main-layout (head=~{:: head}, contentHeader=~{:: header}, content=~{:: main}, footer=~{:: footer})"> 
    <head th:remove="tag"> 
     <title>Greeting Head</title> 
    </head> 
    <body> 
     <header th:remove="tag"> 
      Greeting Content Header 
     </header> 
     <main th:remove="tag"> 
      Greeting Content 
     </main> 
    </body> 
    <footer th:remove="tag"> 
     Greeting Footer 
    </footer> 
</html> 
-3

一つの方法のように見えます使用してのように見えます方言は、私が「メインレイアウト」と呼ぶレイアウトテンプレートとして使用するフラグメント上の引数を使用することです。この例では、オーバーライドする必要のない要素は除外できますが、提供するものは 'main-layout'の部分に追加されます。

+1

前回の回答の恥知らずのコピーペーストのため、ダウン投票しています。 –

関連する問題