thymeleaf - javascript inline

2021-07-07 16:37:30 +09:00
parent 5ae2c9df13
commit 71c30c0578
2 changed files with 41 additions and 0 deletions
--- a/thymeleaf/src/main/java/com/example/thymeleaf/basic/BasicController.java
+++ b/thymeleaf/src/main/java/com/example/thymeleaf/basic/BasicController.java
@@ -114,6 +114,12 @@ public class BasicController {
        return "basic/block";
    }

+    @GetMapping("/javascript")
+    public String javascript(Model model) {
+        model.addAttribute("user", new User("userA", 10));
+        addUsers(model);
+        return "basic/javascript";
+    }

    private void addUsers(Model model) {
        List<User> list = new ArrayList<>();
--- a/thymeleaf/src/main/resources/templates/basic/javascript.html
+++ b/thymeleaf/src/main/resources/templates/basic/javascript.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+</head>
+<body>
+<!-- 자바스크립트 인라인 사용 전 -->
+<script>
+    var username = [[${user.username}]];
+    var age = [[${user.age}]];
+    //자바스크립트 내추럴 템플릿
+    var username2 = /*[[${user.username}]]*/ "test username";
+    //객체
+    var user = [[${user}]];
+</script>
+<!-- 자바스크립트 인라인 사용 후 -->
+<script th:inline="javascript">
+    var username = [[${user.username}]];
+    var age = [[${user.age}]];
+    //자바스크립트 내추럴 템플릿
+    var username2 = /*[[${user.username}]]*/ "test username";
+    //객체
+    var user = [[${user}]];
+</script>
+
+<!-- 자바스크립트 인라인 each -->
+<script th:inline="javascript">
+    [# th:each="user, stat : ${users}"]
+    var user[[${stat.count}]] = [[${user}]];
+    [/]
+</script>
+
+</body>
+</html>