Thymeleaf学习

Thymeleaf可以处理六种类型的模板，每种类型的模板称为模板模式
*HTML （标记模板模式）
*XML （标记模板模式）
*TEXT 文本模板模式
*JAVASCRIPT
*CSS
*RAW 无操作模板模式
Thymeleaf标准方言中的大多数处理器都是属性处理器，因为浏览器将简单的忽略其不识别的属性。例如向下面的JSP代码无法显示出来
<from: input type="text" name="userName" value="${user.name}">
然而Thymeleaf将允许我们实现上述代码相同的功能

<input type="text" name="userName"  value="James carrot" th:value="${user.name}"/>

HTML5规范要求用户自定义属性以data-前缀开头

<p data-th-text="#{home.welcome}">welcome to our grocery store!</p>

Thymeleaf允许使用#{…..}语法表达式指定对应的特定消息：

<p th:text="#{home.welcome}">Welcome to our grocery store!</p>

标准语法表达式
简单表达式
变量表达式：${………..}
选择变量表达式：*{……}
消息表达式：#{………….}
链接网址表达式：@{……..}
片段表达式：~{…….}
文字
文字：’one text’,’Another one’
消息
消息文本不是完全静态，但我们想知道是哪个用户访问该网站

   <p th:text="#{${welcomeMsgKey}(${session.user.name})}">
   Welcome to our grocery store,Sebastian Pepper!
   </p>

标准表达式详解
1.变量表达式
用于访问容器上下文环境中的变量

   <input th:text="${ID}"></input>
             <input th:if="${Ul.Power}==1">管理员</input>

2.星号表达式

 <div th:object="${UL}">
          <p>Name:  <span th:text="*{Name}">张</span>.</p>
          <p>LastName:<span th:text="*{lastName}">三</span>.</p>
          <p>Address:<span th:text="*{addr}">北京</span>
          </div>

 Html解释：首先使用th:object来邦定后台传来的UserPower对象，然   后使用*来代表这个对象，后面{}中的值是此对象中的属性

3.消息表达式
与th:text属性一起使用，指明th:text的标签的文本是#{}中的key 所对应的value,而标签内的文本将不会显示

         <p th:text="#{home.language}">This text will not be show!</p>
         home.language=这段代码将会被显示

访问页面，效果是英文不会被显示，显示的是属性文件中的中文
4.URL表达式
超链接url表达式

           <script th:src="@{/static/js/jquery-2.4.min.js}"></script>

thymeleaf属性介绍
1. th:action
定义后台控制器的路径，类似于标签的action属性

<from id="login" th:action="@{/login}">......</from>

2.th:each
将一个对象集合遍历输出，和jstl中的类似而且还可以遍历数组及Map

<tr th:each="user,iterStat:${list}">
    <td th:text="${user.userName}">Onions</td>
</tr>
<li>Map类型的循环：
     <div th:each="mapS:{map}">
     <div th:text="${mapS}"></div>
</li>
<li>数组的循环：  
                <div th:each="arrayS:${arrays}">  
                <div th:text="${arrayS}"></div>  
                </div>  
            </li>  

3.th:href、th:src、th:id
定义超链接，类似标签的href属性。value形式为@{/login}

<a class="login" th:href="@{/login}"></a>

 用于外部资源的引入，类似<script>标签的src属性，常与@{}表达式结合使用

<script th:src="@{/static/js/jquery-2.4.min.js}"></script>

类似html标签中的id属性

<div class="user" th:id="(${index})"></div>

4.th:if
这个属性使用也非常频繁，比如后台传来一个key，判断value的值，1为男，2为女。

   <span th:if="${Sex} == 1" >
       <input type="redio" name="se"  th:value="男" />
   </span>
   <span th:if="${Sex} == 2">
       <input type="redio" name="se"  th:value="女"  />
   </span>

5.th:value
类似html中的value属性，能对某元素的value属性进行赋值

      <input type="hidden" id="StartNo" name="StartNo"      th:value="${StartNo}">

6.th:text
用于文本的显示

<input type="text" id="RealName" name="RealName"
th:text="${RealName}">

7.th:attr
这个属性用于给HTML中某元素的某属性赋值

<input type="hidden" id="StartNo" name="StartNo" th:attr="value=${StartNo}" >