th:each 循环固定次数

在 Thymeleaf 中，th:each 循环是基于集合的，它会遍历整个集合来生成相应的 HTML 内容。如果你想循环固定次数，可以使用 Thymeleaf 的内置变量 #numbers 来实现。例如，要循环 5 次，可以使用以下代码：

<div th:each="i : ${#numbers.sequence(1,5)}">
   <p th:text="${i}">Iteration</p>
</div>

这里使用了 #numbers.sequence(start, end) 方法来生成一个从 start 到 end 的整数序列，将其作为 th:each 循环的参数。这样，循环就会执行 5 次，分别输出 1~5 的数字。

相关问题

thymeleaf th:each循环js语句

Thymeleaf 中可以使用 th:each 指令来循环遍历一个集合，同时可以在循环体中嵌入 JavaScript 代码。以下是一个示例：

<ul>
  <li th:each="item : ${items}">
    <span th:text="${item.name}"></span>
    <script th:inline="javascript">
        var value = [[${item.value}]]; // 在循环体中定义 JavaScript 变量
        console.log(value);
    </script>
  </li>
</ul>

在上面的例子中，我们使用 th:each 遍历了一个名为 items 的集合，循环变量名为 item，然后在循环体中嵌入了 JavaScript 代码，使用 th:inline="javascript" 指定了内联 JavaScript 模式。在 JavaScript 代码中，我们使用了 Thymeleaf 的表达式 [[${item.value}]] 来获取 item 对象中的 value 属性，并将其赋值给了 JavaScript 变量 value。最后，我们在控制台中打印了这个变量的值。

需要注意的是，在内联 JavaScript 模式下，Thymeleaf 中的表达式需要使用双重方括号 [[...]] 来包裹，以避免与 JavaScript 中的语法冲突。

html th:each分页循环

Thymeleaf 的 th:each 指令可以在 HTML 中循环遍历集合，但是它本身并不支持分页。如果你想要在 Thymeleaf 中实现分页循环，你可以使用 Spring Boot 自带的分页插件 Pageable 和 Page。

首先在 Spring Boot 中配置 Pageable 和 Page，例如：

@Configuration
@EnableJpaRepositories(basePackages = {"com.example.repository"})
@EnableTransactionManagement
public class PersistenceConfig {

    @Bean
    public DataSource dataSource() {
        HikariConfig config = new HikariConfig();
        config.setJdbcUrl("jdbc:mysql://localhost:3306/testdb");
        config.setUsername("username");
        config.setPassword("password");
        return new HikariDataSource(config);
    }

    @Bean
    public JpaVendorAdapter jpaVendorAdapter() {
        HibernateJpaVendorAdapter adapter = new HibernateJpaVendorAdapter();
        adapter.setDatabase(Database.MYSQL);
        adapter.setShowSql(true);
        adapter.setGenerateDdl(false);
        adapter.setDatabasePlatform("org.hibernate.dialect.MySQL8Dialect");
        return adapter;
    }

    @Bean
    public LocalContainerEntityManagerFactoryBean entityManagerFactory() {
        LocalContainerEntityManagerFactoryBean emf = new LocalContainerEntityManagerFactoryBean();
        emf.setDataSource(dataSource());
        emf.setJpaVendorAdapter(jpaVendorAdapter());
        emf.setPackagesToScan("com.example.entity");
        return emf;
    }

    @Bean
    public JpaTransactionManager transactionManager() {
        return new JpaTransactionManager(entityManagerFactory().getObject());
    }

    @Bean
    public PaginationInterceptor paginationInterceptor() {
        return new PaginationInterceptor();
    }

    @Bean
    public PageableHandlerMethodArgumentResolver pageableHandlerMethodArgumentResolver() {
        PageableHandlerMethodArgumentResolver pageableResolver = new PageableHandlerMethodArgumentResolver();
        pageableResolver.setOneIndexedParameters(true);
        pageableResolver.setFallbackPageable(PageRequest.of(0, 10));
        pageableResolver.setMaxPageSize(100);
        return pageableResolver;
    }

    @Override
    public void addArgumentResolvers(List<HandlerMethodArgumentResolver> resolvers) {
        resolvers.add(pageableHandlerMethodArgumentResolver());
    }
}

然后在你的控制器中使用 Pageable 对象获取分页数据，例如：

@GetMapping("/users")
public String getUsers(Pageable pageable, Model model) {
    Page<User> page = userRepository.findAll(pageable);
    model.addAttribute("page", page);
    return "users";
}

最后在 Thymeleaf 的 HTML 页面中使用 Page 对象进行循环遍历和分页导航，例如：

<table>
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Email</th>
        </tr>
    </thead>
    <tbody>
        <tr th:each="user : ${page.content}">
            <td th:text="${user.id}"></td>
            <td th:text="${user.name}"></td>
            <td th:text="${user.email}"></td>
        </tr>
    </tbody>
</table>
<div>
    <ul>
        <li th:if="${page.hasPrevious()}">
            <a th:href="@{${#httpServletRequest.requestURI}}?page=${page.previousPageable().pageNumber}">&lt;&lt;</a>
        </li>
        <li th:each="i : ${#numbers.sequence(0, page.totalPages - 1)}">
            <a th:href="@{${#httpServletRequest.requestURI}}?page=${i}" th:text="${i + 1}"></a>
        </li>
        <li th:if="${page.hasNext()}">
            <a th:href="@{${#httpServletRequest.requestURI}}?page=${page.nextPageable().pageNumber}">&gt;&gt;</a>
        </li>
    </ul>
</div>

这样就可以在 Thymeleaf 中实现分页循环了。