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>