<!DOCTYPE html>
<html>
<head>
<title>jquery tpml test</title>
<script
src="https://code.jquery.com/jquery-3.4.0.min.js"
integrity="sha256-BJeo0qm959uMBGb65z40ejJYGSgR7REI4+CW1fNKwOg="
crossorigin="anonymous"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
</head>
<body>
<script id="each" type="text/x-jquery-tmpl">
<li>ID: ${ID}; Name: ${Name};<br />
Langs:
<ul>
{{each Langs}}
<li>${$index + 1}: <label>${$value}. </label></li>
{{/each}}
</ul>
</li>
</script>
<script type="text/javascript">
$(function(){
var userLangs = [
{ID: 'think8848', Name: 'Joseph Chan', Langs: ['Chinese', 'English']},
{ID: 'aClud', Name: "Mary Cheung", Langs: ['Chinese', 'French']}
];
// 模板 绑定 数据 添加到 位置
$('#each').tmpl(userLangs).appendTo('#eachList');
})
</script>
<ul id="eachList" style="border:1px solid red;">
</ul>
</body>
</html>
原文出处:
https://www.cnblogs.com/joeylee/p/3457273.html#undefined