Thymeleaf if文でリストのサイズを判定する方法!初心者向けガイド
新人
「Thymeleafでif文を使って、リストのサイズを判定する方法ってありますか?」
先輩
「ありますよ!Thymeleafのth:if属性を使えば、リストのサイズを条件分岐できます。」
新人
「なるほど!Spring BootとThymeleafを使う場合の具体的なサンプルも見てみたいです。」
先輩
「いいですね!それでは、Pleiades+Gradle環境での開発を前提に、Thymeleafのif文でリストサイズを判定する方法を一緒に学びましょう!」
1. Thymeleafでリストを扱う基本的な考え方
Spring BootでWebアプリケーションを開発するとき、@ControllerクラスからHTMLにリストを渡すことがよくあります。例えば、ユーザー一覧や商品リストなどを画面に表示する場合ですね。
Thymeleafでは、こうしたリストをテンプレートエンジンとして受け取って、繰り返し処理や条件分岐を行います。Spring Bootの@ControllerでModelにリストを追加して、HTML側でth:eachやth:ifを使って表示する仕組みです。
まずは、Spring Bootの@Controllerクラスでリストを準備する例を見てみましょう。
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import java.util.Arrays;
import java.util.List;
@Controller
public class ItemController {
@GetMapping("/items")
public String showItems(Model model) {
List<String> items = Arrays.asList("りんご", "みかん", "バナナ");
model.addAttribute("items", items);
return "items";
}
}
このように、Modelにitemsというリストを追加しています。このitemsをThymeleafテンプレートで使っていきます。
2. th:ifを使ったリストのサイズ判定の基本
次に、Thymeleafのth:ifを使ってリストのサイズを条件分岐する方法を解説します。リストのサイズを判定するのは、画面に「データがある場合」と「データがない場合」で表示を切り替えるときに便利です。
Thymeleafでは、size()を使ってリストの要素数を取得できます。これをth:ifに渡すことで、条件分岐ができます。
具体的なThymeleafのHTMLテンプレート例を見てみましょう。
アイテム一覧
<h1>アイテム一覧</h1>
<div th:if="${items.size() > 0}">
<ul>
<li th:each="item : ${items}" th:text="${item}"></li>
</ul>
</div>
<div th:if="${items.size() == 0}">
<p>アイテムがありません。</p>
</div>
この例では、まずth:if="${items.size() > 0}"でリストに要素が1つ以上ある場合に<ul>リストを表示します。もしリストのサイズが0の場合は、th:if="${items.size() == 0}"で「アイテムがありません。」というメッセージを表示します。
このように、Thymeleafではif文の条件分岐でリストのサイズ判定を簡単に行うことができます。これは、Webアプリケーションで「データがある・ない」をユーザーに分かりやすく伝えるためにとても重要です。
実際にブラウザで確認すると、リストにデータがある場合はアイテムが表示され、データがない場合はメッセージが表示されます。ぜひPleiadesで実行して、動作を確かめてみてください。
3. よく使うサイズ判定のパターン
ここでは、Thymeleafでよく使うリストサイズ判定のパターンを紹介します。まず代表的なのは、size() > 0を使うパターンです。これはリストに要素が一つ以上あるときに処理を実行する場合に便利です。また、size() == 0を使ってリストが空であることを判定するパターンもよく使われます。
たとえば、下記のような場合が考えられます。
- 商品リストが空のときに「商品がありません」と表示
- ユーザー一覧が空のときに「ユーザーがいません」と表示
- 検索結果が空のときに「該当するデータはありません」と表示
このように、リストのサイズによって表示を切り替える場面は多いです。Spring BootとThymeleafを組み合わせた開発では、@Controllerで渡したリストがあるかどうかをThymeleafのth:ifで柔軟に切り替えることができます。
4. 空リストかどうかの判定例
次に、リストが空かどうかを判定して条件分岐する具体的な例を見ていきましょう。たとえば、ユーザー一覧を表示する画面を考えます。Spring Bootの@Controllerで、ユーザー情報をリストとしてHTMLに渡します。
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import java.util.ArrayList;
import java.util.List;
@Controller
public class UserController {
@GetMapping("/users")
public String showUsers(Model model) {
List<String> users = new ArrayList<>();
// 今回は空リストとして渡します
model.addAttribute("users", users);
return "users";
}
}
このusersは空リストです。ThymeleafのHTMLテンプレートでは、このリストが空かどうかをth:ifで判定できます。
ユーザー一覧
<h1>ユーザー一覧</h1>
<div th:if="${users.size() == 0}">
<p>現在、ユーザーが登録されていません。</p>
</div>
<div th:if="${users.size() > 0}">
<ul>
<li th:each="user : ${users}" th:text="${user}"></li>
</ul>
</div>
この例のように、th:if="${users.size() == 0}"でリストが空の場合のメッセージを表示できます。逆にth:if="${users.size() > 0}"ではリストに要素があるときのみ表示されます。
このように、Thymeleafではif文の条件分岐を使って、空リストかどうかを柔軟に判定することが可能です。
5. リストのサイズに応じた表示切り替え
最後に、リストのサイズに応じて表示内容を切り替える例をもう少し深掘りしてみましょう。例えば、リストのサイズが3件以下の場合は「少ないデータ」、4件以上の場合は「多いデータ」と表示を切り替えるケースです。
まず、Spring Bootの@Controllerで4件のデータを渡す例を見てみます。
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import java.util.Arrays;
import java.util.List;
@Controller
public class DataController {
@GetMapping("/data")
public String showData(Model model) {
List<String> dataList = Arrays.asList("データ1", "データ2", "データ3", "データ4");
model.addAttribute("dataList", dataList);
return "data";
}
}
そして、ThymeleafのHTMLテンプレートでリストサイズに応じて条件分岐を行います。
データ一覧
<h1>データ一覧</h1>
<div th:if="${dataList.size() <= 3}">
<p>データが少ないです。</p>
</div>
<div th:if="${dataList.size() >= 4}">
<p>データが多いです。</p>
</div>
<ul>
<li th:each="data : ${dataList}" th:text="${data}"></li>
</ul>
このように、th:ifにサイズ判定条件を入れることで、リストのサイズに応じた柔軟な表示切り替えができます。ユーザーにわかりやすい画面作りをするために、こうしたサイズ判定を活用することがとても大切です。
ぜひPleiades+Gradle環境で動かしてみて、リストのサイズに応じた表示切り替えの動きを確認してみてください。Spring Bootの@ControllerとThymeleafのth:ifを組み合わせることで、よりユーザーフレンドリーな画面を作成できます。
6. 実務での活用例と注意点
ここからは、Thymeleafのif文でリストのサイズ判定を実務でどう活かすか、また使うときの注意点を具体的に紹介します。
実務でよくあるパターン
- 管理画面で未承認データだけ表示するとき、
th:if="${pendingList.size() > 0}"と使う - 検索機能で結果が0件だったときに「該当データなし」と表示する
- ページング処理で「次のページへ」ボタンを、リストが一定件以上なら表示する
たとえば、承認待ちのリストを管理者画面で表示する場合の@ControllerとHTMLは次のようになります。
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import java.util.List;
@Controller
public class AdminController {
@GetMapping("/admin/pending")
public String showPending(Model model) {
List<String> pendingList = fetchPendingFromService();
model.addAttribute("pendingList", pendingList);
return "admin-pending";
}
private List<String> fetchPendingFromService() {
// ダミー処理。実際にはDB検索など
return List.of("申請A", "申請B");
}
}
管理者:申請一覧
<h1>承認待ち申請</h1>
<div th:if="${pendingList.size() > 0}">
<ul>
<li th:each="p : ${pendingList}" th:text="${p}"></li>
</ul>
</div>
<div th:if="${pendingList.size() == 0}">
<p>現在、未承認の申請はありません。</p>
</div>
注意点:コストと可読性
Thymeleafのif文は便利ですが、複雑な条件分岐を入れすぎると、HTMLテンプレートが読みにくくなります。たとえば、${list.size() > 0 && user.admin}のような論理式を直接書くと、保守性が下がりやすいです。
おすすめは、@Controller側で「boolean hasData」などの判定変数を用意してModelに渡し、th:if="${hasData}"でスッキリ書く方法です。
boolean hasPending = pendingList != null && !pendingList.isEmpty();
model.addAttribute("hasPending", hasPending);
<div th:if="${hasPending}">…</div>
また、リストがnullのときにsize()を呼ぶと例外が発生するので、nullチェックも忘れずに!Gradleで依存チェックをしっかり行い、破損しない環境を保つことも大切です。
7. 初心者への学習のコツ
ThymeleafやSpring Bootを初めて学ぶ初心者にとって、if文やサイズ判定は少しわかりづらいかもしれません。ここでは、学習をすすめるためのポイントを紹介します。
まずは小さな画面で試す
大きな画面構成で一度に覚えるよりも、100行以内の簡単なテンプレートでth:ifを触ってみると理解しやすくなります。たとえば、itemsリストだけを表示/非表示にするなどの簡単な画面で練習すると良いでしょう。
GradleビルドとPleiadesの活用
Pleiades+Gradle環境では、Gradleの再ビルドや依存関係解決が簡単です。./gradlew buildを実行しながら、@ControllerでModelに渡す値が正しくHTMLに反映されているかを確認して学習しましょう。
デバッグとログ出力
実行時にitemsの内容が想定と違う場合は、@ControllerでSystem.out.println(items)などのログ出力でリスト内容を確認しましょう。Javaのログ出力に慣れることも大切です。
テンプレートの可視化を意識
テンプレート内にコメントを入れたり、HTMLをインデントして、どこがif文の開始・終了かをわかりやすくしておくと、後から見返したときに理解しやすくなります。
8. ポイント整理
この記事では、Pleiades+Gradle環境のSpring Bootアプリケーションで@ControllerからThymeleafにリストを渡し、th:ifを使ったリストのサイズ判定方法を初心者むけにやさしく解説しました。
- リストに要素があるかどうかは
size() > 0やisEmpty()の判定で処理を切り替えられる - 空リストかどうかで表示内容を変えると、ユーザーに親切な画面になる
- サイズに応じて「少ない/多い」など条件分岐してバリエーション豊かにできる
- 実務では制御用の boolean 変数をModelに渡すなど、コントローラで処理してテンプレートをシンプルに保つと良い
- GradleビルドやPleiadesの開発環境を活用すると、開発速度が上がり、エラーも防ぎやすい
Thymeleafのif文や条件分岐、サイズ判定の理解は、Webアプリケーションを作るうえでとても重要です。初心者のうちにじっくり触って、自信を持って活用できるようになりましょう!
ぜひ、Pleiades+Gradle+Spring Boot+Thymeleafの組み合わせで、実際に動くサンプルを作りながら学んでください。応援しています。
まとめ
Thymeleafのif文でリストサイズを判定する重要性
この記事では、Thymeleafのif文を使ってリストのサイズを判定し、画面表示を切り替える方法について、Spring Bootと@Controllerの連携を前提に詳しく解説してきました。 Webアプリケーション開発では、一覧表示や検索結果、管理画面など、リストデータを扱う場面が非常に多くあります。 その際に「データが存在する場合」と「データが存在しない場合」を明確に分けて表示することは、ユーザー体験を向上させるうえで欠かせません。 Thymeleafのth:ifを使ったリストサイズ判定は、こうした画面制御をシンプルかつ直感的に実装できる点が大きな魅力です。
特に、items.size() > 0 や size() == 0 といった条件式は、初心者でも理解しやすく、実務でも頻繁に利用されます。 商品一覧、ユーザー一覧、検索結果、承認待ちデータなど、あらゆるリスト表示で応用できるため、早い段階で身につけておきたい基本技術といえるでしょう。 また、Spring Bootの@ControllerでModelにリストを渡し、Thymeleafテンプレート側で条件分岐する流れを理解することで、バックエンドとフロントエンドの役割分担も自然に意識できるようになります。
実務を意識したサイズ判定の考え方
実務では、単にリストが空かどうかを判定するだけでなく、リストの件数に応じて表示内容を変えるケースも多くあります。 例えば、検索結果が0件の場合は注意メッセージを表示し、数件だけの場合は簡易表示、多い場合はページングや補足説明を出すといった工夫が考えられます。 Thymeleafのif文を使えば、こうした条件分岐もHTMLテンプレート内で柔軟に記述できます。
ただし、条件式が複雑になりすぎるとテンプレートの可読性が下がる点には注意が必要です。 そのため、記事中で紹介したように、Controller側でboolean変数を用意し、Modelに渡してからth:ifで判定する方法はとても有効です。 このやり方を身につけておくと、Thymeleafテンプレートをすっきり保ちつつ、安全で保守しやすい画面制御が実現できます。
サンプルコードで振り返る基本パターン
ここで、Thymeleafのif文を使ったリストサイズ判定の基本形を、改めてサンプルコードで整理しておきましょう。 以下は、リストに要素がある場合とない場合で表示を切り替える、最も基本的で実務でもよく使われる例です。
表示するデータがありません。
このように、size()を使った条件分岐を覚えておくだけで、多くの画面要件に対応できます。 Spring BootとThymeleafを組み合わせた開発では、まずこの形を確実に理解し、自分のものにすることが大切です。 Pleiades+Gradle環境で実際に動かしながら確認すると、リストサイズと画面表示の関係がより明確に理解できるでしょう。
生徒:Thymeleafのif文でリストのサイズを判定できるのは便利ですね。データがないときの表示も簡単に作れそうです。
先生:そうだね。実務では「何も表示されない画面」よりも、「データがありません」と伝える方が親切なんだ。
生徒:size() > 0 と size() == 0 を使い分けるだけで、かなり多くのケースに対応できると感じました。
先生:その通り。まずは基本をしっかり押さえて、慣れてきたら件数に応じた表示切り替えにも挑戦してみよう。
生徒:Controller側でbooleanを渡す方法も勉強になりました。テンプレートが読みやすくなりそうですね。
先生:良いところに気づいたね。ThymeleafとSpring Bootの役割を分けて考えると、保守しやすいコードが書けるようになるよ。
Thymeleafのif文を使ったリストサイズ判定は、初心者にとって最初の壁になりやすいポイントですが、 一度理解してしまえば、Webアプリケーション開発のさまざまな場面で応用できる強力な武器になります。 Spring Boot、@Controller、Model、Thymeleafテンプレートの連携を意識しながら、ぜひ実際の開発で積極的に活用してみてください。 基本を丁寧に積み重ねることで、読みやすく、使いやすい画面を自信を持って作れるようになるはずです。