javascript - 使用 jQuery 模板渲染 JSON

Question

几天来，我一直在尝试使用 jQuery 模板进行一些 JSON 渲染，但没有成功……我希望比我更聪明的人能够发现我哪里出错了。

所以我的 JSON 数据返回类似这样的内容:

[{"pk": 1, "model": "blobs.blob", "fields": {"content": "hello"}}, {"pk": 2, "model": "blobs.blob", "fields": {"content": "goodbye"}}];

然后我尝试使用 jQuery 模板呈现 JSON 返回的每个项目:

var blob_template = '<p>${content}</p>';

$.template('blobTemplate', blob_template );

$.getJSON('/myurl/', function(data) {

    $('blobTemplate').empty();

    var blobs = data;

    $.tmpl('blobTemplate', blobs)
        .appendTo('div');
});

模板呈现良好但没有来自 ${content} 的数据。我没有收到任何错误或未定义的消息，但我不知道我哪里出错了？非常感谢任何帮助!

更新:

好的，为了避免使用已弃用的方法或额外的脚本/插件，这是更好的方法吗？

$.getJSON('/myurl/', function(data) {
    var blobs = [];

    $.each(data, function(i, data) {
        var blob_template = '<p>' + data[i].fields.content + '</p>';

        blobs.push(blob_template);
    });

    $(notes.join('')).appendTo('div');
});

这似乎导致数据 [i] 未定义 :(

Answer 1

根据我对已弃用模板插件的有限了解，它不会获取 content 属性，因为它不是 JSON 对象集合中每个对象的顶级属性。我认为您的模板应如下所示:

<p>
    {{each fields}}
        ${$value}
    {{/each}}
</p>