springboot使用thymeleaf-程序员宅基地
技术标签： springboot
1.引入依赖
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring‐boot‐starter‐thymeleaf</artifactId> </dependency> <properties> <thymeleaf.version>3.0.9.RELEASE</thymeleaf.version> <thymeleaf‐layout‐dialect.version>2.2.2</thymeleaf‐layout‐dialect.version> </properties>
thymeleaf会自动渲染resource/templates下的html文件，静态资源存放在resource/static中
2.新建测试html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div th:text="${msg}">这是显示欢迎信息</div>
<br/>
id: <span th:text="${user.name}"></span>
name: <span th:text="${user.age}"></span>
age: <span th:text="${user.sex}"></span>
<br/>
<br/>
<a href="#" th:href="'http://localhost:8080/user?id=' + ${user.age}">a标签文本内容</a>
<br/>
<p th:each="user: ${userList}">
<span th:text="${user.sex}" >xxx</span>
<span th:text="${user.name}" >xxx</span>
<span th:text="${user.age}" >xxx</span>
</p>
<span th:if="${user.sex eq '男'}">1</span>
<span th:if="${user.sex eq '女'}">2</span>
</div>
</body>
</html>展示效果
3.常用写法
| 关键字 | 功能介绍 | 案例 |
|---|---|---|
| th:id | 替换id | <input th:id="'xxx' + ${collect.id}"/> |
| th:text | 文本替换 | <p th:text="${collect.description}">description</p> |
| th:utext | 支持html的文本替换 | <p th:utext="${htmlcontent}">conten</p> |
| th:object | 替换对象 | <div th:object="${session.user}"> |
| th:value | 属性赋值 | <input th:value="${user.name}" /> |
| th:with | 变量赋值运算 | <div th:with="isEven=${prodStat.count}%2==0"></div> |
| th:style | 设置样式 | th:style="'display:' + @{(${sitrue} ? 'none' : 'inline-block')} + ''" |
| th:onclick | 点击事件 | th:onclick="'getCollect()'" |
| th:each | 属性赋值 | tr th:each="user,userStat:${users}"> |
| th:if | 判断条件 | <a th:if="${userId == collect.userId}" > |
| th:unless | 和th:if判断相反 | <a th:href="@{/login}" th:unless=${session.user != null}>Login</a> |
| th:href | 链接地址 | <a th:href="@{/login}" th:unless=${session.user != null}>Login</a> /> |
| th:switch | 多路选择 配合th:case 使用 | <div th:switch="${user.role}"> |
| th:case | th:switch的一个分支 | <p th:case="'admin'">User is an administrator</p> |
| th:fragment | 布局标签，定义一个代码片段，方便其它地方引用 | <div th:fragment="alert"> |
| th:include | 布局标签，替换内容到引入的文件 | <head th:include="layout :: htmlhead" th:with="title='xx'"></head> /> |
| th:replace | 布局标签，替换整个标签到引入的文件 | <div th:replace="fragments/header :: title"></div> |
| th:selected | selected选择框 选中 | th:selected="(${xxx.id} == ${configObj.dd})" |
| th:src | 图片类地址引入 | <img class="img-responsive" alt="App Logo" th:src="@{/img/logo.png}" /> |
| th:inline | 定义js脚本可以使用变量 | <script type="text/javascript" th:inline="javascript"> |
| th:action | 表单提交的地址 | <form action="subscribe.html" th:action="@{/subscribe}"> |
| th:remove | 删除某个属性 | <tr th:remove="all"> 1.all:删除包含标签和所有的孩子。 |
| th:attr | 设置标签属性，多个属性可以用逗号分隔 | 比如 th:attr="src=@{/image/aa.jpg},title=#{logo}"，此标签不太优雅，一般用的比较少。 |
字符串拼接可用‘|’
<span th:text="|hello, ${user.name}!|">
智能推荐
OCR-Python-Opencv一种基于坐标投影的图片旋转矫正方法_投影矫正算法-程序员宅基地
文章浏览阅读3.5k次，点赞4次，收藏39次。由于最近公司业务需要使用OCR功能，所以我不得不研究Opencv这个图像库，进行OCR功能前期的图像处理工作，二值化、灰度化什么的都非常简单这里就不过多讲述，下面记录我自己受到启发自己实现的一种基于坐标投影的图片矫正算法，其实思路非常简单，大神勿喷，再次做一个小分享也算是我自己对该方面知识的一个总结和整理。ps:该算法适合旋转角度不大，在-35~35度的旋转角矫正，具备一定抗干扰能力（当然也不..._投影矫正算法
Pytorch、Tensorflow、Keras 框架下实现KNN算法（MNIST数据集）附详解代码_knn pytorch-程序员宅基地
文章浏览阅读4k次，点赞7次，收藏26次。Pytorch、Tensorflow、Keras框架下实现KNN算法（MNIST数据集）附详解代码K最近邻法（KNN）是最常见的监督分类算法，其中根据K值的不同取值，模型会有不一样的效率，但是并不是k值越大或者越小，模型效率越高，而是根据数据集的不同，使用交叉验证，得出最优K值。Python—KNN分类算法（详解）欧式距离的快捷计算方法基于Pytorch实现KNN算法：#****************************************************************_knn pytorch
Android EditText输入框的使用（很详细很基础）-程序员宅基地
文章浏览阅读5.7k次，点赞6次，收藏11次。关于Android手机的各类输入框，在编辑多行文本，文本块，统一使用的是EditText，这也是我们使用的最多的常用控件之一，在此做一个简单的总结。一、基础属性首先，EditText作为一个控件，他是继承于View的，所以他具有View的很多属性及方法。当然，现在出了个AppCompatEditText，它是继承于EditText的，加了一些外观的处理，其余的用法那些一模一样。在写Xml界面时，我们可以通过Android：，tools：，自定义属性等等为其定义各种属性。这些属性可以确定他的.._android edittext
【EDA】Electric VLSI Design System(芯片设计软件): 介绍_electric芯片设计-程序员宅基地
文章浏览阅读2.9k次。http://savannah.gnu.org/projects/electricThis project is part of the GNU Project.A circuit design system for IC layout, schematics, hardware description languages, and more.Registration Date: Fri 06 Apr 2001 02:32:31 AM UTCLicense:GNU General Pub._electric芯片设计
元心科技分享：Gstreamer 初探 (五) (GTK+)_gstreamer画界面必须在主线程吗-程序员宅基地
文章浏览阅读885次。Gstreamer 初探 (五)（GTK+）本次教程我们介绍将Gstreamer集成到GTK+中的操作详解，基本上Gstreamer负责媒体流的处理，用户交互的部分留给GTK+来处理，最有趣的部分是Gstreamer如何将视频输出到Gtk+的窗口，而Gtk+将用户操作转发到Gstreamer进行控制通过这次课程，请留意以下内容：如何将Gstreamer的视频输出到指定的窗口（而不是让其创建自己的窗口）如何将Gstreamer的信息在界面上进行刷新如何从Gstreamer的多个线程中更新界面如_gstreamer画界面必须在主线程吗
三维GIS显示中，利用太阳高度角和方位角计算光照_太阳方位角与高度角对应光线向量-程序员宅基地
文章浏览阅读4k次。三维GIS显示中，利用太阳高度角和方位角计算光照利用【太阳方位角】和【太阳高度角】进行光照计算的时候，需要注意：– 1、 坐标系是球坐标系，具体正方向如下图所示：极坐标公式：x=rsinθcosφ.y=rsinθsinφ.z=rcosθ.φ：由x轴出发，逆时针旋转到地物方位所得的角度；θ：由z轴出发，顺时针旋转到地物方位所得的角度；– 2、太阳高度角和方位角正方向表示：太阳高..._太阳方位角与高度角对应光线向量
随便推点
解决Mysql Workbench突然无法使用的问题_workbench无法确定是否存在环境链接,环境对象无效-程序员宅基地
文章浏览阅读2.9k次。右击我的电脑——》管理——》服务和应用程序——》服务——》Mysql——》双击选择启动\_workbench无法确定是否存在环境链接,环境对象无效
Apache Oozie Installation-程序员宅基地
文章浏览阅读95次。oozie就是一个workflow协调系统，主要用来管理Hadoop作业(job)。属于web应用程序，由oozie client和oozie server两个组件构成。oozie server运行于java servlet容器（tomcat）中的web程序。由于使用HUE需要oozie的支持，所以先介绍oozie的安装配置，后续增加HUE的安装配置文档。1、环境介绍前期已配置好Hadoop集群服..._apache oozie 安装包
Jittor 深度学习框架入门（pytorch转换）、对比_jittor和pytorch哪个好-程序员宅基地
文章浏览阅读2.1k次。1.PyTorch是一个开源的Python机器学习库，基于Torch，用于自然语言处理等应用程序。中文网站：https://pytorch-cn.readthedocs.io/zh/latest/2.NumPy（Numerical Python）是Python的一种开源的数值计算扩展。这种工具可用来存储和处理大型矩阵，比Python自身的嵌套列表（nested list structure)结构要高效的多（该结构也可以用来表示矩阵（matrix）），支持大量的维度数组与矩阵运算，此外也针对数组运_jittor和pytorch哪个好
postman测试接口成功，实际发请求时失败_postman成功,云效接口自动执行失败-程序员宅基地
文章浏览阅读5.9k次，点赞2次，收藏3次。postman测试接口成功，实际发请求时失败，当遇到这个问题的时候，你需要关注一下两次携带的数据是否相同，有可能是因为格式的不同导致的，我最近也遇到了这个问题，因为postman测试的sh_postman成功,云效接口自动执行失败
read函数---------详解-程序员宅基地
文章浏览阅读3.7w次，点赞5次，收藏36次。read函数从打开的设备或文件中读取数据。#include ssize_t read(int fd, void *buf, size_t count); 返回值：成功返回读取的字节数，出错返回-1并设置errno，如果在调read之前已到达文件末尾，则这次read返回0参数count是请求读取的字节数，读上来的数据保存在缓冲区buf中，同时文件的当前读写位置向后移。注_read函数
lombok @Builder注解 和 build父类属性问题_@builder 父类-程序员宅基地
文章浏览阅读8.2k次。1、简介通过@Builder注解，lombok可以方便的实践建造者模式。2、使用1）创建基类Userimport lombok.*;/** * @author 周鑫(玖枭) */@Getter@Setter@ToString@NoArgsConstructor@AllArgsConstructor@Builderpublic class User { private Long id; private String name;}2）创建子类UserExt_@builder 父类