公告:欢迎访问,查看更多资源请点我^.^!            点我关闭广告
SpringBoot_C~Thymeleaf模版
2018-06-03 22:31:13
794人阅读
评论(0)
分类:Java

一 引入依赖

    <dependency>

    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-thymeleaf</artifactId>

    </dependency>

二 配置视图解析器

    spring-boot很多配置都有默认配置,比如默认页面映射路径为 

    classpath:/templates/*.html 

    同样静态文件路径为 

    classpath:/static/

    在application.properties中可以配置thymeleaf模板解析器属性.就像使用springMVC的JSP解析器配置一样

    具体可以配置的参数可以查看 

    org.springframework.boot.autoconfigure.thymeleaf.ThymeleafProperties这个类,

    上面的配置实际上就是注入到该类中的属性值.

三 后台

    项目结构:

    blob.png

    后台编写就和之前JSP用EL表达式取值类似,就是正常的mvc编写模式:

blob.png


    源码:

    @Controller

    public class ThymeleafController {

        @Autowired

        private UserService userService;

        @RequestMapping(value = "/index")

        public String index(Model model) {

            model.addAttribute("username", "赵超");

            // model.addAttribute("user", new User("赵超", "111111", "18701321850", "bruce", "2018-03-19"));

            model.addAttribute("user", userService.findByUserName("bb"));

            model.addAttribute("count", userService.getCountOfUser());

            model.addAttribute("users", userService.findAll());

            return "index";

        }

    }

四 前台

    <a href="#" th:href="@{'https://www.zhaochao.top/iBlog/article.html?id=' + ${user.id}}">点击</a>

blob.png

blob.png

    页面预览效果:

blob.png

    源码:

    <!DOCTYPE html>

    <!-- 引入模版语法 -->

    <html xmlns:th="http://www.thymeleaf.org">

        <head>

            <meta charset="UTF-8"/>    

            <title>SpringBootStudy</title>    

            <!-- 引入css文件,引入url的格式:@{...},类似的标签有:th:href和th:src 直接读取static文件夹中内容 -->    

            <link type="text/css" th:href="@{/css/index.css}" rel="stylesheet" href="css/index.css"/>

        </head>

        <body>    

            <!-- 获取变量值 -->    

            <p>

                您好,<b th:text="${username}">呵呵哒</b>

            </p>    

            <!-- Thymeleaf中使用th:if和th:unless属性进行条件判断,标签中内容只有在th:if中条件成立时才显示;        th:unless于th:if恰好相反,只有表达式中的条件不成立,才会显示其内容。 -->    

            <p th:if="${user.passWord == '111111'}" th:text="密码过于简单1">密码简单1</p>    

            <p th:unless="${user.passWord == '222222'}" th:text="密码过于简单2">密码简单2</p>    

            <!-- 逻辑运算符>, <, <=,>=,==,!=都可以使用,唯一需要注意的是使用<,>时需要用它的HTML转义符 -->    

            <p>

                用户数量:<span th:text="${count}"></span>  <span th:if="${count} &gt; 2" th:text="人很多"></span>

            </p>

            <!-- 选择表达式*{} 很像变量表达式,不过它们用一个预先选择的对象来代替上下文变量容器(map)来执行,    被指定的object由th:object属性定义 -->

            <div th:object="${user}">    

                <p>用户名:<span th:text="*{userName}"></span></p>    

                <p>邮箱:<span th:text="*{email}"></span></p>

            </div>    

            <table>        

                <tr>     

                    <th>序号</th>            

                    <th>用户名</th>            

                    <th>昵称</th>            

                    <th>邮箱</th>            

                    <th>注册时间</th>        

                </tr> 

                <tr th:each="u, i: ${users}">    

                <!-- i称作状态变量,属性有:            index:当前迭代对象的index(从0开始计算)            count: 当前迭代对象的index(从1开始计算)            size:被迭代对象的大小            current:当前迭代变量            even/odd:布尔值,当前循环是否是偶数/奇数(从0开始计算)            first:布尔值,当前循环是否是第一个            last:布尔值,当前循环是否是最后一个 -->    

                    <td th:text="${i.count}"></td>            

                    <!-- 支持switch语句,默认值default使用*替代 -->            

                    <td th:switch="${u.userName}">                

                        <span th:case="'aa'">aa有点简单吧</span>                

                        <span th:case="'bb'">bb有点NC吧</span>                

                        <span th:case="*" th:text="${u.userName}">其他名称</span>            

                    </td>            

                    <td th:text="${u.nickName}"></td>            

                    <td th:text="${u.email}"></td>            

                    <td th:text="${u.regTime}"></td>        

                </tr>    

            </table>     

            <!-- thymeleaf的内置对象:dates、calendars、strings、numbers等等,在${}中通过#号使用 -->    

            <p th:text="${#dates.format(#dates.createNow(), 'yyyy-MM-dd HH:mm:ss')}">获取当前时间并格式化</p>    

            <p th:text="${#dates.createToday()}">获取当日</p>    <p th:text="${#strings.isEmpty('')}">判断是否为空</p>    

            <p th:text="${#strings.startsWith('8888', '8')}">判断是否以某字符串开始</p>    

            <p th:text="${#strings.length('12345678')}">获取字符串长度</p>    

            <p th:text="${#strings.equalsIgnoreCase('aa', 'AA')}">判断是否相等,忽略大小写</p>    

            <p th:text="${#strings.randomAlphanumeric(7)}">随机生成7位字母的字符串</p>

        </body>

    </html>


五 常用th标签

blob.png

blob.png

blob.png





分享一下:
赞一下(0)
博主资料
博主头像
zc521106
文章:34
浏览:19899
文章分类
Java(12)
NoSql(112)
数据库(12)
前端(12)
阅读排行
Java基础知识
(12)
NoSql应用
(112)
数据库Oracle语法
(12)
前端常用工具类
(12)
java web项目
(12)
linux安装mysql
(12)
评论区
这篇文章怎么样?写点评论吧!
姓名:
邮箱:
有回复时通知我:
发表
回复【10.20.30.32】:
暂无评论,快抢沙发!
* 以上用户言论只代表其个人观点,不代表iBlog网站的观点或立场,如有任何疑问请随时联系管理员...