Thymeleafでの反復

投稿日: 2019-10-18 2022-10-29
タグ: Spring MVC, Thymeleaf

1. 概要

Thymeleaf は、 XML、XHTML、およびHTML5ドキュメントを処理するための多用途のJavaテンプレートエンジンです。

このクイックチュートリアルでは、ライブラリが提供する他のいくつかの機能とともに、Thymeleafを使用して反復を実行する方法を見ていきます。

Thymeleafの詳細については、紹介記事こちらをご覧ください。

2. Mavenの依存関係

この例を作成するために、SpringFrameworkライブラリをThymeleafライブラリと一緒に使用します。

ここで、依存関係（thymeleafおよびthymeleaf-spring）を確認できます。

<dependency>
    <groupId>org.thymeleaf</groupId>
    <artifactId>thymeleaf</artifactId>
    <version>3.0.11.RELEASE</version>
</dependency>
<dependency>
    <groupId>org.thymeleaf</groupId>
    <artifactId>thymeleaf-spring5</artifactId>
    <version>3.0.11.RELEASE</version>
</dependency>

3. セットアップ例

ビューレイヤーにジャンプする前に、この例のMVC構造を作成しましょう。

モデルレイヤーのスニペットコードから始めます。

public class Student implements Serializable {
    private Integer id;
    private String name;
    // standard contructors, getters, and setters
}

モデルをロードしてビューレイヤーに戻すためのコントローラーメソッドも提供しましょう。

@GetMapping("/listStudents")
public String listStudent(Model model) {
    model.addAttribute("students", StudentUtils.buildStudents());
    return "listStudents.html";
}

上記のサンプルでは、 buildStudents（）メソッドは、 Student オブジェクトのリストを返し、それをmodelに追加します。

4. th：each属性

Thymeleafでは、 th：each属性を使用して反復を実行します。

この属性の興味深い点の1つは、が、次のようないくつかの異なるデータ型 、を受け入れて反復することです。

実装するオブジェクトjava.util.Iterable
java.util.Mapを実装するオブジェクト
配列
その他のオブジェクトは、1つの要素を含む単一値のリストであるかのように扱われます

次に、上記の例で設定したデータを使用して、 th：each属性を呼び出します。

<tr th:each="student: ${students}">
    <td th:text="${student.id}" />
    <td th:text="${student.name}" />
</tr>

コードスニペットは、 th：eachがStudentsのリストを反復処理していることを示しています。 モデル属性は${}表記を使用してアクセスされ、リストの各要素は学生変数を介してループの本体に渡されます。

5. ステータス変数

Thymeleafはも、ステータス変数を介して反復プロセスを追跡するための便利なメカニズムを有効にします。

ステータス変数は、次のプロパティを提供します。

index ：0（ゼロ）で始まる現在の反復インデックス
count ：これまでに処理された要素の数
size ：リスト内の要素の総数
even / odd ：現在の反復インデックスが偶数か奇数かをチェックします
first ：現在の反復が最初の反復であるかどうかを確認します
last ：現在の反復が最後の反復であるかどうかを確認します

この例でステータス変数がどのように機能するかを見てみましょう。

<tr 
  th:each="student, iStat : ${students}" 
  th:style="${iStat.odd}? 'font-weight: bold;'" 
  th:alt-title="${iStat.even}? 'even' : 'odd'">
    <td th:text="${student.id}" />
    <td th:text="${student.name}" />
</tr>

ここでは、 iStat.odd プロパティを含めて、条件を評価し、現在の行に太字のスタイルを設定しました。次の評価でも同じことが行われますが、今回は iStat.even を使用して、alt /titleHTML属性を介して値を出力しています。

ステータス変数（この例では iStat として示されています）の明示的な作成を省略した場合、 studentStat、を使用するだけでステータス変数を呼び出すことができます。は、変数studentと接尾辞Stat。の集合です。

6. 結論

この記事では、Thymeleafライブラリが提供する多くの機能の1つについて説明しました。

属性th：each と、すぐに使用できるプロパティを使用して、Thymeleafでイテレーションを提示しました。

この記事に示されているコードの動作バージョンは、GitHubリポジトリで入手できます。

getdocs

13036