840
No
Mustache 템플릿 문법
수많은 언어에서 지원되는 초간단 템플릿 문법
class UserController
package net.slipp.web;
import java.util.ArrayList;
import java.util.List;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
@Controller
public class UserController {
private static final Logger log = LoggerFactory.getLogger(UserController.class);
private List<User> users=new ArrayList<>();
@PostMapping("/create")
public String create(User user){
log.info("create : {}", user.toString());
users.add(user);
return "redirect:list";
}
@GetMapping("/list")
public String list(Model model){
model.addAttribute("users", users);
return "list";
}
}
list.html
<!-- mustach 이용한 동적인 데이터 출력 -->
{{#users}}
<tr>
<th scope="row">{{userId}}</th>
<td>{{name}}</td>
<td>{{email}}</td>
</tr>
{{/users}}
list.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<link href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<a class="navbar-brand" href="/">SLiPP</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="/form.html">회원가입</a></li>
<li><a href="/list">회원목록</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<table class="table table-condensed">
<caption>사용자 목록</caption>
<thead>
<tr>
<th>사용자 아이디</th>
<th>이름</th>
<th>이메일</th>
</tr>
</thead>
<tbody>
<!-- mustach 이용한 동적인 데이터 출력 -->
{{#users}}
<tr>
<th scope="row">{{userId}}</th>
<td>{{name}}</td>
<td>{{email}}</td>
</tr>
{{/users}}
</tbody>
</table>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="/webjars/jquery/3.2.1/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script>
</body>
</html>
댓글 ( 5)
댓글 남기기