Java 如何将css文件添加到Spring引导应用程序（Thymeleaf）分页_Java_Spring Boot_Pagination_Thymeleaf

Java 如何将css文件添加到Spring引导应用程序（Thymeleaf）分页

java spring-boot pagination

Java 如何将css文件添加到Spring引导应用程序（Thymeleaf）分页,java,spring-boot,pagination,thymeleaf,Java,Spring Boot,Pagination,Thymeleaf,我尝试在我的网站上进行分页 my PostController.java文件包含： @GetMapping("/") public String index(Model model) { return findPaginated(0, model); } @GetMapping("/page/{pageNo}") public String findPaginated( @PathVar

我尝试在我的网站上进行分页

my PostController.java文件包含：


@GetMapping("/")
    public String index(Model model) {
        return findPaginated(0, model);
    }


@GetMapping("/page/{pageNo}")
    public String findPaginated(
            @PathVariable("pageNo") int pageNo,
            Model model
    ) {
        int pageSize = 3;

        Page<Post> page = postService.findPaginated(pageNo, pageSize);
        List<Post> listPosts = page.getContent();

        model.addAttribute("currentPage", pageNo);
        model.addAttribute("totalPages", page.getTotalPages());
        model.addAttribute("totalItems", page.getTotalElements());

        model.addAttribute("page", page);

        int totalPages = page.getTotalPages();

        if (totalPages > 0) {
            List<Integer> pageNumbers = IntStream.rangeClosed(1, totalPages).boxed().collect(Collectors.toList());
            model.addAttribute("pageNumbers", pageNumbers);
        }

        model.addAttribute("listPosts", listPosts);

         return "index";
    }


<head xmlna:th="http://www.thymeleaf.org">
--snip--
<link href="assets/css/font-awesome.min.css" rel="stylesheet">
--snip--

</head>

<body>

--snip--

 <!-- ADDING PAGINATION-->

                <nav aria-label="...">
                    <ul class="pagination">
                        <li class="page-item">
                            <a class="page-link"
                               th:href="@{'/page/' + ${currentPage - 1}}"
                               th:if="${currentPage < totalPages + 1 and currentPage > 1}">Previous</a>
                        </li>
                        <li th:class="${pageNumber == page.getNumber() + 1} ? 'page-item active': 'page-item'"
                            th:each="pageNumber: ${pageNumbers}" th:if="${page.getTotalPages() > 0}">
                            <a class="page-link"
                               th:href="@{'/page/' + ${pageNumber}}"
                               th:text="${pageNumber}">
                            </a>
                        </li>
                        <li class="page-item">
                            <a class="page-link"
                               th:href="@{'/page/' + ${currentPage + 1}}"
                               th:if="${currentPage < totalPages and currentPage >= 1}">Next</a>
                        </li>
                    </ul>
                </nav>

                <!-- /ADDING PAGINATION-->

--snip--

</body>


@GetMapping（“/”）
公共字符串索引（模型）{
返回FindPagined（0，型号）；
}
@GetMapping（“/page/{pageNo}”）
公共字符串findPagined(
@PathVariable（“pageNo”）int pageNo，
模型
) {
int pageSize=3；
页面=postService.FindPagined（页码、页面大小）；
List listPosts=page.getContent（）；
model.addAttribute（“当前页面”，页码）；
addAttribute（“totalPages”，page.getTotalPages（））；
addAttribute（“totalItems”，page.getTotalElements（））；
model.addAttribute（“页面”，第页）；
int totalPages=page.getTotalPages（）；
如果（总页数>0）{
List pageNumbers=IntStream.rangeClosed（1，totalPages.boxed（）.collect（Collectors.toList（））；
model.addAttribute（“页码”，页码）；
}
model.addAttribute（“listPosts”，listPosts）；
返回“索引”；
}

而index.html文件包含：


@GetMapping("/")
    public String index(Model model) {
        return findPaginated(0, model);
    }


@GetMapping("/page/{pageNo}")
    public String findPaginated(
            @PathVariable("pageNo") int pageNo,
            Model model
    ) {
        int pageSize = 3;

        Page<Post> page = postService.findPaginated(pageNo, pageSize);
        List<Post> listPosts = page.getContent();

        model.addAttribute("currentPage", pageNo);
        model.addAttribute("totalPages", page.getTotalPages());
        model.addAttribute("totalItems", page.getTotalElements());

        model.addAttribute("page", page);

        int totalPages = page.getTotalPages();

        if (totalPages > 0) {
            List<Integer> pageNumbers = IntStream.rangeClosed(1, totalPages).boxed().collect(Collectors.toList());
            model.addAttribute("pageNumbers", pageNumbers);
        }

        model.addAttribute("listPosts", listPosts);

         return "index";
    }


<head xmlna:th="http://www.thymeleaf.org">
--snip--
<link href="assets/css/font-awesome.min.css" rel="stylesheet">
--snip--

</head>

<body>

--snip--

 <!-- ADDING PAGINATION-->

                <nav aria-label="...">
                    <ul class="pagination">
                        <li class="page-item">
                            <a class="page-link"
                               th:href="@{'/page/' + ${currentPage - 1}}"
                               th:if="${currentPage < totalPages + 1 and currentPage > 1}">Previous</a>
                        </li>
                        <li th:class="${pageNumber == page.getNumber() + 1} ? 'page-item active': 'page-item'"
                            th:each="pageNumber: ${pageNumbers}" th:if="${page.getTotalPages() > 0}">
                            <a class="page-link"
                               th:href="@{'/page/' + ${pageNumber}}"
                               th:text="${pageNumber}">
                            </a>
                        </li>
                        <li class="page-item">
                            <a class="page-link"
                               th:href="@{'/page/' + ${currentPage + 1}}"
                               th:if="${currentPage < totalPages and currentPage >= 1}">Next</a>
                        </li>
                    </ul>
                </nav>

                <!-- /ADDING PAGINATION-->

--snip--

</body>


--剪断--
--剪断--
--剪断--








--剪断--

当程序第一次运行时，一切看起来都正常。因此，我添加了一些帖子（这个应用程序是关于写帖子并在index.html文件中显示它们的），以及我想去的时候，例如：

localhost:8080/page/1

css、js和img文件未上载。我检查了网络，它显示我没有上传

localhost:8080/page/assets/css/font-awesome.min.css

。实际上，它一定是

localhost:8080/assets/css/font-awesome.min.css

。但它到底为什么会告诉我这条路

我怎样才能修好它

若你们并没有收到问题，那个么我上传了一些额外的图片，以便更好地理解：

提前谢谢。我希望您能理解。

尝试在资产之前的开始处添加额外的/

<link href="/assets/css/font-awesome.min.css" rel="stylesheet">

我最近也遇到了这样的问题。我确信我没有像“/”这样的问题。后来，我发现对于Thymeleaf，

的使用安排不同

如果有像我这样的问题，请尝试使用

你可以找到一个例子

编辑：

我想这里要做的就是以Thymeleaf可以解析的方式使用表达式。我们已经知道，我们需要使用

href

指定CSS文件，以便能够在HTML文件中使用它。然而，据我所知，如果我们打算在Spring端使用Thymeleaf，我们需要以它可以解析的方式给出一些东西

以下是Thymeleaf文件中的声明：

Thymeleaf标准方言（称为standard和SpringStandard）提供了一种在web应用程序中轻松创建URL的方法，以便它们包含任何必需的URL准备工件。这是通过所谓的链接表达式实现的，这是一种Thymeleaf标准表达式：@{…}

这样，当我们填写

th:href

时，Thymeleaf将为我们解决此问题。至少我是这么理解的

有关详细信息，请检查：

在资产之前，请尝试在开始处添加额外的斜杠。非常感谢，您知道我搜索了几天，终于（感谢您）解决了这个问题。欢迎您！你的意思是，第一句话和第二句话不同？我编辑了实际的评论，因为它有点长。请检查一下。