• Thymeleaf 常用属性


     

     

    如需了解Thymeleaf 基本表达式,请参考《Thymeleaf 基本表达式》一文

     

    th:action

    定义后台控制器路径,类似<form>标签的action属性。

    例如:

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

    th:each

    对象遍历,功能类似jstl中的<c:forEach>标签。

    例如:

    public class StudentRequestBean {
    
    private List<Student> students;
    
    ...
    
    }
    
    public class Student implements Serializable{
    
    private String firstName;
    
    private String school;
    
    ...}
    
    @RequestMapping(value
    = "/addStudent", method = RequestMethod.POST) public String addStudent(@ModelAttribute(value = "stuReqBean") StudentRequestBean stuReqBean,ModelMap model) {...}
    <form id="login-form" th:action="@{/addStudent}" 
    
    th:object="${stuReqBean}" method="POST">
    
    <div class="student" th:each="stuIter,rowStat:${stuReqBean.students}">
    
    <input type="text" class="firstName" value="" 
    
    th:field="*{students[__${rowStat.index}__].firstName}"></input>
    
    <input type="text" class="school" value="" 
    
    th:field="*{students[__${rowStat.index}__].school}"></input>
    
    ...
    
    </div>
    
    </form>

    上面的例子中通过选择表达式*{}既能将表单绑定到后台的StudentRequestBean中的集合属性students,也能将Servlet上下文中的StudentRequestBean中的List类型的students变量回显,回显时通过th:each进行遍历。

    注意1:绑定集合属性元素下标的用法*{students[__${rowStat.index}__].firstName}

    注意2:如果List<Student> studentsnull,页面将无法显示表单,后台必须给students初始化一个值,即:

    List<Student > stus = new ArrayList<Student >();
    
    stus .add(new Student ());
    
    StudentRequestBean.setStudents(stus );

    注意3stuIter代表students的迭代器

     

    th:field

    常用于表单字段绑定。通常与th:object一起使用。 属性绑定、集合绑定。

    如:

    public class LoginBean implements Serializable{...
    
    private String username;
    
    private List<User> user;
    
    ...}
    
    
    public class User implements Serializable{...
    
    private String username;;
    
    ...}
    
    
    @RequestMapping(value = "/login", method = RequestMethod.POST)
    
    public String login(@ModelAttribute(value = "loginBean") LoginBean loginBean,ModelMap model) {..}
    <form id="login-form" th:action="@{/login}" th:object="${loginBean}">...
    
    <input type="text" value="" th:field="*{username}"></input>
    
    <input type="text" value="" th:field="*{user[0].username}"></input>
    
    </form>

    th:href

    定义超链接,类似<a>标签的href 属性。value形式为@{/logout}

    例如:

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

    th:id

    div id声明,类似html标签中的id属性。

    例如:

    <div class="student" th:id = "stu+(${rowStat.index}+1)"></div>

    th:if

    条件判断。

    例如:

    <div th:if="${rowStat.index} == 0">... do something ...</div>

    th:include

    见th:fragment

     

    th:fragment

    声明定义该属性的div为模板片段,常用与头文件、页尾文件的引入。常与th:include,th:replace一起使用。

    例如:

    声明模板片段/WEBINF/templates/footer. html 

    <div th: fragment=" copy" >
    
    © 2011 The Good Thymes Virtual Grocery
    
    </div>

    引入模板片段

    <div th: include=" /templates/footer : : copy" ></div>
    
    <div th: replace=" /templates/footer : : copy" ></div>

    th:object

    用于表单数据对象绑定,将表单绑定到后台controller的一个JavaBean参数。常与th:field一起使用进行表单数据绑定。

    例如:

    public class LoginBean implements Serializable{...}
    
    
    @RequestMapping(value = "/login", method = RequestMethod.POST)
    
    public String login(@ModelAttribute(value = "loginBean") LoginBean loginBean,ModelMap model) {...}
    <form id="login-form" th:action="@{/login}" th:object="${loginBean}">...</form>

    th:src

    用于外部资源引入,类似于<script>标签的src属性,常与@{}一起使用。

    例如:

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

     

    th:replace

    见th:fragment

     

    th:text

    文本显示。

    例如:

    <td class="text" th:text="${username}" ></td>

    th:value

    用于标签复制,类似<option>标签的value属性。

    例如:

    <option th:value="Adult">Adult</option>
    
    <input  id="msg" type="hidden" th:value="${msg}" />
  • 相关阅读:
    【题解】「CF1373B」01 Game
    asdfasd
    android开发DialogFragment禁止按back键消失的解决方法
    MySQL报错1055
    IDEA中使用Git拉取代码时报 Git pull failed原因及处理方法
    数据挖掘导论 完整版+PPT+Python R代码
    MATLAB统计分析与应用 40个案例分析[源代码及数据]
    机器学习实战 中英文版
    电力系统负荷预测数据集【全】含下载链接
    Nginx 导致swagger setCookie sessionid 失效
  • 原文地址:https://www.cnblogs.com/hjwublog/p/5051732.html
Copyright © 2020-2023  润新知