Question

我的源代码在这里：

我无法弄清楚为什么它无法正确渲染。还有，没有一种方法可以将数据嵌套在另一个对象中吗？

<script id='myTemplate' type='text/x-jquery-tmpl'>

Table of stuffs:

<table>
{{each value}}
<tr>
    <td>${name}</td>
    <td>${value}</td>
</tr>
{{/each}}

</table>


</script>


<div id="target">

</div>



var something = function () { };

var results = [{ name: 'First', value: 1 }, { name: 'Second', value: 2 }];

something.value = results;

$('#myTemplate').tmpl(something).appendTo('#target');

Answer 1

您只需要这两行：

var results = [{ name: 'First', value: 1 }, { name: 'Second', value: 2 }];
$('#myTemplate').tmpl({value: results}).appendTo('#target');

我正在使用普通对象而不是函数。请参阅演示：http://jsfiddle.net/2pkHL/6/。

你可以让事情变得更简单。由于只有行受数据影响（不是<table>），因此您只能在模板中包含行，直接提供数据作为数据，tmpl将自动为每个元素生成HTML在数组中：

<script id='myTemplate' type='text/x-jquery-tmpl'>
<tr>
    <td>${name}</td>
    <td>${value}</td>
</tr>
</script>

Table of stuffs:
<table id="target">
</table>

JS：

var results = [{ name: 'First', value: 1 }, { name: 'Second', value: 2 }];
$('#myTemplate').tmpl(results).appendTo('#target');

在此处查看此版本：http://jsfiddle.net/2pkHL/11/

Answer 2

好吧，你的主要问题是你说var something是一个函数。如果你把它变成一个物体，你就准备好了！：）

这是一个更新的小提琴; http://jsfiddle.net/2pkHL/5/

当然还有更新的vode：

<script id='myTemplate' type='text/x-jquery-tmpl'>
Table of stuffs:
<table>
{{each value}}
<tr>
    <td>${name}</td>
    <td>${value}</td>
</tr>
{{/each}}
</table>
</script>
<div id="target">
</div>

和JS：

var something = {};

var results = [{ name: 'First', value: 1 }, { name: 'Second', value: 2 }];

something.value = results;

$('#myTemplate').tmpl(something).appendTo('#target');

Jquery模板不能与'each'一起使用

2 个答案: