Thymeleaf常用属性

时间:2019-10-18
本文章向大家介绍Thymeleaf常用属性,主要包括Thymeleaf常用属性使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

th:each

该属性较为常用,比如从后台传来一个对象集合那么就可以使用此属性遍历输出,它与JSTL中的<c: forEach>类似,此属性既可以循环遍历集合,也可以循环遍历数组及Map。

循环list

controller构建list数据:

@RequestMapping(value="/users")
public String selectAllUser (Model model) {

    ArrayList<User> userList = new ArrayList<>();
    for (int i = 0; i < 10; i++) {
        User user = new User();
        user.setId(i);
        user.setName("jack" + i);
        user.setPhone("13"+i+"11111111");
        userList.add(user);
    }

    model.addAttribute("userList", userList);
    return "user";
}

HTML:

这里的interStat类似于jstl里面foreach的varStatus,可以获取到当前的迭代信息。

<table>
    <tr th:each="user, interStat : ${userList}">
        <td th:text="${interStat.index}"></td>
        <td th:text="${user.id}"></td>
        <td th:text="${user.name}"></td>
        <td th:text="${user.phone}"></td>
    </tr>
</table>

interStat里面一些属性的含义:

index: 当前迭代对象的index(从0开始计算)
count: 当前迭代对象的个数(从1开始计算)
size: 被迭代对象的大小
current: 当前迭代变量
even/odd: 布尔值,当前循环是否是偶数/奇数(从0开始计算)
first: 布尔值,当前循环是否是第一个
last: 布尔值,当前循环是否是最后一个

循环map

controller构建map数据:

@RequestMapping(value="/usersMap")
public String selectAllUserMap (Model model) {

    HashMap<String, User> userMap = new HashMap<>();
    for (int i = 0; i < 10; i++) {
        User user = new User();
        user.setId(i);
        user.setName("jack" + i);
        user.setPhone("13"+i+"11111111");
        userMap.put(String.valueOf(i), user);
    }

    model.addAttribute("userMap", userMap);
    return "user";
}

HTML:

myMapVal.key相当于map的键,myMapVal.value相当于map中的值。

<div th:each="myMapVal : ${userMap}">
    <span th:text="${myMapValStat.count}"></span>
    <span th:text="${myMapVal.key}"></span>
    <span th:text="${myMapVal.value.name}"></span>
    <span th:text="${myMapVal.value.phone}"></span>
    <br/>
</div>

循环数组

controller构建数组数据:

@RequestMapping(value="/usersArray")
public String selectAllUserArray (Model model) {

    User[] userArray = new User[10];

    for (int i = 0; i < 10; i++) {
        User user = new User();
        user.setId(i);
        user.setName("jack" + i);
        user.setPhone("13"+i+"11111111");
        userArray[i] = user;
    }

    model.addAttribute("userArray", userArray);
    return "user";
}

HTML:

<div th:each="myArrayVal : ${userArray}">
    <div th:text="${myArrayVal.name}"></div>
    <div th:text="${myArrayVal.phone}"></div>
</div>

th:id

动态设置html标签中的id属性,比如:

<span th:id="${hello}">good</span>

这样会获取从后台传入的hello的值,然后将这个值作为id的值。

th:if

条件判断,比如后台传来一个变量,判断该变量的值,0为男,1为女:

<span th:if="${sex} == 0" >
    男:<input type="radio" name="sex"  th:value="男" />
</span>
<span th:if="${sex} == 1">
    女:<input type="radio" name="sex" th:value="女"  />
</span>

th:switch/th:case

switch,case判断语句,比如:

<div th:switch="${sex}">
  <p th:case="0">性别:男</p>
  <p th:case="1">性别:女</p>
  <p th:case="*">性别:未知</p>
</div>

这里的*表示默认,当上面的case都是false的时候,会执行默认的内容。

th:value

类似html标签中的value属性,能对某元素的value属性进行赋值,比如:

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

th:inline

th:inline有三个取值类型

  • text

    从后台取出数据展示

    <span th:inline="text">Hello, [[${user.nick}]]</span>
    等同于:
    <span>Hello, <span th:text="${user.nick}"></span></span>
  • none

    有时候希望在html中直接显示[[1,2,3],[4,5]],此时可以使用none

    <p th:inline="none"> [[1, 2, 3], [4, 5]]!</p>
  • javasript

    如果希望在JavaScript中获取后台相应的数据,可以使用下面内容:

    <script th:inline="javascript" type="text/javascript">
          var msg  = "Hello," + [[${user.phone}]];
          alert(msg);
    </script>

原文地址:https://www.cnblogs.com/atsdb/p/11696772.html