Printemps + Thymeleaf - comment mettre en place la pagination pour une liste

Je développe une application simple à l'aide de Printemps + Thymeleaf. Sur l'une des pages, j'ai une liste d'éléments qui doit être paginé.

Idéalement, je voudrais seulement envoyer les currPageNo (le numéro de la page en cours) et numOfPages (le nombre total de pages) les variables de la vue et le reste de l'ouvrage serait terminé là-bas (c'est une présentation du problème et n'a rien à voir avec la logique d'entreprise). Si, toutefois, la solution la plus propre serait de m'obliger à faire quelques calculs dans le contrôleur de premier, je l'accepterais comme un petit mal.

Je voudrais obtenir la liste des pages dans le formulaire ci-dessous.

<Prev | 1 | ... | 3 | 4 | 5 | 6 | 7 | ... | 15 | Next>

Je n'ai pu venir avec la solution suivante. Il fonctionne, mais je crois que vous serez d'accord que c'est très salissant et très difficile à lire.

Par ailleurs, en plus currPageNo et numOfPages j'ai dû envoyer plus de deux variables de la vue. La solution idéale serait de ne pas m'obliger à le faire.

firstPageNo = Math.max(2, currPageNo - 2)
lastPageNo = Math.min(numOfPages - 1, currPageNo + 2)

La version actuelle de mon code qui suit.

<ul>
    <li th:if="${currPageNo &gt; 1}">
        <a th:href="@{/items.html(pageNo = ${currPageNo - 1})}" href="">&lt; Prev</a>
    </li>
    <li th:class="${currPageNo == 1} ? 'selected'">
        <a th:href="@{/items.html(pageNo = 1)}" th:if="${currPageNo &gt; 1}" href="">1</a>
        <span th:if="${currPageNo == 1}">1</span>
    </li>
    <li th:if="${currPageNo &gt;= 5}">
        ...
    </li>
    <li th:each="pageNo : ${#numbers.sequence(firstPageNo, lastPageNo)}"  th:class="${currPageNo == pageNo} ? 'selected'">
        <a th:href="@{/items.html(pageNo = ${pageNo})}" th:if="${pageNo != currPageNo}" th:text="${pageNo}" href="">2</a>
        <span th:if="${pageNo == currPageNo}" th:text="${pageNo}">2</span>
    </li>
    <li th:if="${currPageNo &lt;= (numOfPages - 4)}">
        ...
    </li>
    <li th:class="${currPageNo == numOfPages} ? 'selected'">
        <a th:href="@{/items.html(pageNo = ${numOfPages})}" th:if="${currPageNo &lt; numOfPages}" th:text="${numOfPages}" href="">10</a>
        <span th:if="${currPageNo == numOfPages}" th:text="${numOfPages}">1</span>
    </li>
    <li th:if="${currPageNo &lt; numOfPages}">
        <a th:href="@{/items.html(pageNo = ${currPageNo + 1})}" href=""> Next &gt;</a>
    </li>
</ul>

La liste suivante sumarizes les questions que je tiens à vous débarrasser de la plupart. Je comprends que certains d'entre eux sont inhérents à la plate-forme, mais encore, la liste semble être arrêter de long et le code de désordre.

  • Avoir à envoyer les valeurs précalculées de firstPageNo et lastPageNo à la vue du contrôleur.
  • Avoir à utiliser &lt; au lieu de < dans les expressions.
  • Avoir à utiliser à la fois un point d'ancrage et un span avec mutuellement exclusifs conditions pour que le navigateur de ne pas utiliser un lien de la page en cours.

Je salue également toutes les autres suggestions sur la façon d'améliorer la qualité du code.


Je comprends que cette question serait peut-être un meilleur ajustement pour la Révision du Code du site, mais, comme Thymeleaf semble être une technologie avec une petite base d'utilisateurs encore, j'attends une réponse raisonnable plutôt ici sur Stack Overflow, qui a beaucoup plus d'utilisateur de la base (je crois).

Si, toutefois, une telle question n'est vraiment pas la bienvenue ici, merci de considérer le déplacement vers la droite du site au lieu de le fermer alors que j'ai reçu les conseils dont j'ai besoin.