thymeleaf常用语法大全

有时候需要借鉴别人的代码,发现一个相似的功能点,但是自己的是html页面别人的是jsp页面,那如果不了解thymeleaf的话还是要费点功夫的。

什么是thymeleaf,通俗点,jsp中的${},以及jstl中的if标签什么的都不能用,在html中要使用thymeleaf,比如${}变成了[[${}]]等。

我使用thymeleaf将下面的jsp页面完全转化为了html页面,我总结下常用语法!

thymeleaf常用语法大全_第1张图片

一、首先thymeleaf的引入:

引入依赖



org.springframework.boot

spring-boot-starter-thymeleaf

然后就能用了

二、常用语法

1、页面插入,比如翻页功能就经常单独作为一个页面然后插入到主页面中

page.html中最外面加个div标签包住(使用fragment标记)

.........  

主页面中插入

  意思是插入page页面中的被包住的flag那一段

2、 为了防止user以及name为null页面报错,写成如下格式 所有的.前面加个?就行了,如${list?.user?.name}

3、select选项标签

th:selected用于编辑页面数据回显,th:each是遍历filmTypes,option是遍历出的单值,th:value是提交上去的数据,th:text是显示在页面上的数据

4、复选框功能实现


             
              
            

这个是图片中 复选框功能的实现,th:each遍历的数据是自己分割的,th:checked也是用于编辑页面数据回显,""中的判断结果为true则选中,${#strings.contains()}是thymeleaf中的内置对象,就是各种函数,这里的包含函数作用是判断前面的是否包含后面的,最后的[[${}]]常用于标签之间比如,[[${}]]判空如下

[[${film!=null && film.film_id!=0?'编辑':'添加'}]]电影

5、if判断

                           

这个是替换Jsp中的if标签

6、实现根据传递过来的film参数是否为null动态调整标签为 添加/编辑 页面标题功能

两种,其一:直接在th:text里面判断

其二:使用th:if和th:unless,这两个是个组合

             

7、标签

th:src加载图片,这里的/upload是虚拟路径,映射到F盘的某个图片文件,film是接收的参数

下面还有一个img加载的是本地的图片就没有必要用thymeleaf,要接收参数时用

8、iframe语法

将整个Html页面引入到另一个html中去

意思是将uploadImg.html整个html引入,不需要在uploadImg.html中标记fragment

但是这样引入是有些不好的地方(具体可见下一篇),当然一般情况下没问题,建议用以下方法:

springboot项目中假设静态资源指向static文件夹,直接将要引入的页面放在static文件夹下,然后代码如下 

意思是在resources根目录下开始找uploadImg.html

9、${#lists.size()}内置对象函数,判断传过来的list参数

10、遍历中的count计数器

                                                                   
                                     
[[${count.index+1}]][[${m.film_name}]][[${m.film_type_name}]][[${m.film_actors}]]¥[[${m.film_price}]][[${m.film_date}]][[${m.film_scene}]][[${m.film_room}]][[${m.film_score}]]

th:each="m,count:${films}" 其中,m为遍历单值,count计数

11、a标签格式

12、点击事件

th:onclick="'javascript:openBox(\''+${curCabNo}+'\',\''+${box.no}+'\')'"

13、script格式

你可能感兴趣的:(拿来主义系列,java,前端,开发语言,thymeleaf,模板引擎,html)