我有以下模板
<script id="employeeTemplate" type="text/html">
<tr>
<td>${Name}</td>
<td>${Designation}</td>
<td>{{if Age>30}}
<span style='background-color: red'>Middle-aged</span>
{{else}}
<span style='background-color: yellow'>Still young</span>
{{/if}}</td>
<td>${Department}</td>
<td>${DataSource}</td>
</tr>
</script>
以及以下功能
<script type="text/javascript">
function BindClientSideData() {
//JSON data format
var emps = [
{ Name: "John", Designation: "Analyst", Age: 25, Department: "IT", DataSource: "Client" },
{ Name: "Matthew", Designation: "Manager", Age: 38, Department: "Accounts", DataSource: "Client" },
{ Name: "Emma", Designation: "Senior Manager", Age: 40, Department: "HR", DataSource: "Client" },
{ Name: "Sid", Designation: "Analyst", Age: 27, Department: "HR", DataSource: "Client" },
{ Name: "Tom", Designation: "Senior Analyst", Age: 35, Department: "IT", DataSource: "Client" }
];
BindTable(emps);
}
function BindTable(data) {
// removes existing rows from table except header row
$('#tblEmployee tr:gt(0)').remove();
//apply tmpl plugin to <script> and append result to table
// $("#employeeTemplate").tmpl(data).appendTo("#tblEmployee");
$("#tblEmployee").loadTemplate("#employeeTemplate", data);
}
</script>
问题是当调用 BindClientSideData() 时,我得到以下输出
${Name} ${Designation} {{if Age>30}} Middle-aged {{else}} Still young {{/if}} ${Department} ${DataSource}
${Name} ${Designation} {{if Age>30}} Middle-aged {{else}} Still young {{/if}} ${Department} ${DataSource}
${Name} ${Designation} {{if Age>30}} Middle-aged {{else}} Still young {{/if}} ${Department} ${DataSource}
${Name} ${Designation} {{if Age>30}} Middle-aged {{else}} Still young {{/if}} ${Department} ${DataSource}
${Name} ${Designation} {{if Age>30}} Middle-aged {{else}} Still young {{/if}} ${Department} ${DataSource}
有人可以让我知道为什么模板没有加载数据。
我引用 jQuery 19.2 和 jQuery.tmpl.js
尝试更改 jQuery 模板的语法等,但没有运气。任何帮助表示赞赏。