之前對於前端框架接觸較少，第一次接觸thymeleaf，雖說看起來並不復雜但我還是花費了好一會兒才弄懂。
話不多少下面就簡單說一下我在項目中的應用。
首先是java代碼 controller層 將需要在前端展示的信息放入model中：
@RequestMapping("getAll")
public String getAll(Model model){
List<ScheduleJob> list = scheduleJobService.getAllJob();
model.addAttribute("list", list);
return "sch/quartz/list";
}
之后便是在前端html頁面的遍歷
1 <tr th:each="job:${list}"> 2 <td th:text="${job.name }">任務名</td> 3 <td th:text="${job.group }">任務組</td> 4 <td th:text="${job.status }">狀態</td> 5 <td th:text='${job.cronExpression }'></td> 6 <td th:text="${job.className }">類名</td> 7 <td th:text="${job.description }">描述</td> 8 <td><a href="#" th:href="@{/quartz/pause(name=${job.name},group=${job.group})}">暫停</a></td> 9 <td><a href="#" th:href="@{/quartz/resume(name=${job.name},group=${job.group})}">恢復</a></td> 10 <td><a href="#" th:href="@{/quartz/run(name=${job.name},group=${job.group})}">執行一次</a></td> 11 <td><a href="#" th:href="@{/quartz/delete(name=${job.name},group=${job.group})}">刪除</a></td> 12 <td><button id="edit" th:name="${job.name}" th:id="${job.group}" onclick="test(this)">修改cron表達式</button></td> 13 </tr>
這里直接在<tr>標簽中 用 th:each 放入需要遍歷的內容，以及定義變量名；在<td>標簽中用th:text來展示內容。
在<a>標簽中用 普通的href不能實現帶參的接口請求，所以需要使用 th:href 的這種語法來實現帶參的接口請求，參數用（）跟在后面就可以。
至於調用js的帶參方法就需要用12行那種辦法 將參數作為 th 標簽的name或者id傳入方法中，具體的js方法如下；
1 function test(obj){ 2 var cron = $("#cron").val(); 3 var name = $(obj).attr("name"); 4 var group = $(obj).attr("id"); 5 $.post("edit",{"name":name,"group":group,"cron":cron},function(){ 6 alert("更新成功！！！"); 7 window.location.reload(); 8 }); 9 }
這樣就能實現js帶參方法的調用，目前來說我所知道的可以實現的就是這種方式。
補充一點，前端遍歷的實體類需要重寫toString方法，並且必須是如下格式的：
1 @Override 2 public String toString() { 3 StringBuilder builder = new StringBuilder(); 4 builder.append("{name:\""); 5 builder.append(name); 6 builder.append("\", group:\""); 7 builder.append(group); 8 builder.append("\", cronExpression:\""); 9 builder.append(cronExpression); 10 builder.append("\", status:\""); 11 builder.append(status); 12 builder.append("\", description:\""); 13 builder.append(description); 14 builder.append("\", className:\""); 15 builder.append(className); 16 builder.append("\"}"); 17 return builder.toString(); 18 }
這樣才能在頁面上成功遍歷。
對於thymeleaf，目前我也就掌握了這些簡單的使用。