jquery - 简单 jQuery 模板示例的问题

Question

我正在使用 jquery-tmpl 并接收以下 JSON 数据，我将其用于 ASP.NET MVC3 中的表单验证:

{"Status":1,"Message":"Oh dear, what have you done. Check the list of errors dude!","Errors":["The Contents field is required.","The Date Created field is required.","The Date Updated field is required.","The Updated By field is required."]}

我的模板如下所示:

<script id="ResponseTemplate" type="text/x-jquery-tmpl">
{{each(i, error) Errors}}
    <li>${error}</li>
{{/each}}
</script>

我的 JSON POST 如下:

var data = {
    Contents: "This is a test",
    DateCreated: "",
    DateUpdated: "",
    UpdatedBy: "Ben"
};

$.ajax({
    url: '@Url.Action("save", "note")',
    data: JSON.stringify(data),
    type: 'POST',
    contentType: 'application/json',
    dataType: 'json',
    success: function (result) {
        alert(result.Errors);
        $("#Responses").tmpl(result).appendTo("#ResponseTemplate")
    }
});

数据正确。该警报将错误数组显示为字符串。该模板无法正常工作。

答案必须很简单。

Answer 1

我认为您只是将 Responses 和 ResponseTemplate 混淆了:

$("#ResponseTemplate").tmpl(result).appendTo("#Responses");

这是您的示例(没有 AJAX 调用):http://jsfiddle.net/andrewwhitaker/GcqZX/

您也可以这样编写模板:

<script id="ResponseTemplate" type="text/x-jquery-tmpl">
    <li>${$data}</li>
</script>

并这样调用它:

$("#ResponseTemplate").tmpl(result.Errors).appendTo("#Responses");

(不确定它实际上是否更好，但只是想指出在这种情况下您不必使用 {{each}})。