handlebars获取json对象（单个Javabean对象）
阎德业
package com.handlebars.controller;
import java.sql.Timestamp;
import java.util.Date;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import com.handlebars.vo.Emp;
@RestController
@RequestMapping("/test")
public class TestHandlebarsController {
@RequestMapping("testDemo01.do")
public Emp testDemo01(){
Emp emp = new Emp(1111, "老龚", 33, "1", 1000.00, new Date(), new Timestamp(System.currentTimeMillis()));
return emp;
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<table width="50%">
<thead>
<tr>
<th>ID</th>
<th>NAME</th>
<th>AGE</th>
<th>GENDER</th>
<th>SALARY</th>
<th>BIRTHDAY</th>
<th>HIREDATE</th>
</tr>
</thead>
<tbody id="demo">
</tbody>
</table>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/handlebars-4.0.10.min.js"></script>
<!-- 定义handlebars模板 -->
<script type="text/x-handlebars-template" id="demo_ht">
<tr>
<td>{{id}}</td>
<td>{{name}}</td>
<td>{{gender}}</td>
<td>{{age}}</td>
<td>{{salary}}</td>
<td>{{birthday}}</td>
<td>{{hiredate}}</td>
</tr>
</script>
<script type="text/javascript">
$(function(){
$.ajax({
type:"post",
url:"test/testDemo01.do",
dataType:"json",
success:function(data){
//编译模板
var demo_ht = Handlebars.compile($("#demo_ht").html());
//模板渲染数据
var _html = demo_ht(data);
//dom操作
$("#demo").html(_html);
},
error:function(){
alert("请求发生异常!");
}
});
});
</script>
</body>
</html>
类似资料：