xmlns:th="http://www.thymeleaf.org"
> Variable Expressions: ${...}
> Selection Variable Expressions: *{...}
> Message Expressions: #{...}
> Link URL Expressions: @{...}
> Text literals: 'one text', 'Another one!',…
> Number literals: 0, 34, 3.0, 12.3,…
> Boolean literals: true, false
> Null literal: null
> Literal tokens: one, sometext, main,…
> String concatenation: +
> Literal substitutions: |The name is ${name}|
> Arithmetic operations:
> Binary operators: +, -, *, /, %
> Minus sign (unary operator): -
> Binary operators: and, or
> Boolean negation (unary operator): !, not
> Comparisons and equality:
> Comparators: >, <, >=, <= (gt, lt, ge, le)
> Equality operators: ==, != (eq, ne)
> If-then: (if) ? (then)
> If-then-else: (if) ? (then) : (else)
> Default: (value) ?: (defaultvalue)
@{} example 1:
<link
rel="stylesheet"
type="text/css"
media="all"
href="../../css/my.css"
th:href="@{/css/my.css}"
/>
example 2:
<script
type="text/javascript"
th:src="@{js/main.js}"
src="../static/js/main.js">
</script>
Controller
@RequestMapping({ "/index", "", "/", })
public String init(Model model) {
model.addAttribute("data", "I am tareq"); //data is the variable name
return "index"; //the html page name or page link
}
html/template:
<h1 th:text="${ data}"></h1>
With concat:
<h1 th:text=" 'Hello ' + ${ data}"></h1>
controller:
@RequestMapping({ "/tasks" })
public String getTasks(Model model) {
model.addAttribute("datas", taskRepository.findAll());
return "tasks";
}
template/html:
<a
name="Show tasks"
id="tasks"
class="btn btn-primary mt-5 m-auto"
th:href="@{/tasks}"
role="button"
>Show tasks</a>
Spring Controller:
//tasks page
@RequestMapping({ "/tasks" })
public String getTasks(Model model) {
model.addAttribute("datas", taskRepository.findAll());
return "tasks";
}
template or html:
<tr th:each="task: ${datas}">
<td scope="row" th:text="${task.id}"></td>
<td th:text="${task.key}"></td>
<td th:text="${task.value}"></td>
</tr>
Controller:
@GetMapping("/delete")
public String deleteTask( Long id) {
taskRepository.deleteById(id);
return "redirect:/tasks"; /// here the page in not index its the tasks page for index page use only redirect:/
}
Html:
<tr th:each="task: ${datas}">
<td scope="row" th:text="${task.id}"></td>
<td th:text="${task.key}"></td>
<td th:text="${task.value}"></td>
<td>
<a
name=""
id=""
class="btn btn-danger"
th:href="@{delete/(id=${task.id})}"
role="button"
>Delete</a
>
</td>
</tr>
html:
<tr th:each="task: ${datas}">
<td scope="row" th:text="${task.id}"></td>
<td th:text="${task.key}"></td>
<td th:text="${task.value}"></td>
<td>
<a
name=""
id=""
class="btn btn-danger"
th:href="@{'delete/'+ ${task.id}}"
role="button"
>Delete</a
>
</td>
</tr>
controller:
@GetMapping("/delete/{id}")
public String deleteTask(@PathVariable Long id) {
System.out.println("Delete");
taskRepository.deleteById(id);
return "redirect:/tasks";
}