艰难的jQuery模板问题

假设我有一个这样的模板

<script id="rowTemplate" type="text/x-jquery-tmpl">
    <tr>
        <a href="${ $.tmpl(viewModel.EditUrl, $data).text() }">Edit </a>
        &nbsp;&nbsp;
        <a href="${ $.tmpl(viewModel.DetailsUrl, $data).text() }">Details</a></td>
        <td>${Id}</td>
        <td>${Number}</td>
        <td>${Description}</td>
        <td>${Total}</td>
        <td><input type='image' src="/images/delete.gif" alt="delete" data-bind="click: function() { processCommand({name:'Delete', Data: this, IsAjax:false}) }"></a></td>
    </tr>
</script>

${Id}
${Number}
${Description}
${Total}

显然，我们正在绑定一个集合，并为每个条目创建一行。现在我无法得到的是引用被绑定的“数据”的实例，但必须访问全局“viewModel”变量。我想获取绑定数据的实例，并获取属性“EditUrl”（它本身有一个模板文本）。那我该怎么做呢

完整示例（我也使用knockout.js，但问题不在于此） 问题是我将一个“DTO”列表绑定到一个行。但是EditUrl和CreateUrl不在DTO上，而是在包含DTO的对象（父对象）上

var viewModel=ko.mapping.fromJS（{“Dtos”）：[{“Id”：0，
“描述”：“一些描述”，
“数量”：0，“总数”：0.0，
“日期”：“\/日期（1303495442114-0500）\/”，
{“Id”：1，“Description”：“some Description”，“Number”：100，“Total”：200.0，
“日期”：“\/日期（1271959442114-0500）\/”，
{“Id”：2，“描述”：“一些描述”，“数字”：200，“总数”：400.0，
“日期”：“\/Date（1240423442114-0500）\/”，CreateUrl:”http://localhost:16555/TestOrderProcessingPage/tabid/63/ctl/OrderEdit/orderId/-1/Default.aspx“，
“EditUrl”：”http://localhost:16555/TestOrderProcessingPage/tabid/63/ctl/OrderEdit/mid/387/Default.aspx?orderId=${Id}“，
“详细信息”：http://localhost:16555/TestOrderProcessingPage/tabid/63/ctl/OrderDetails/mid/387/Default.aspx?orderId=${Id}“}）；
{{tmpl contentHeaderTemplate}


命令




//这就是问题“viewModel”，不再有全局viewModel变量，所以问题是如何引用绑定到行的数据。
${Id}
${Number}
${Description}
${Total}
身份证件
数
描述
全部的

最简单的方法是通过“options”参数将viewModel或所需的变量传入jQuery模板

我认为您正在使用Knockout，所以您可以做如下操作：

<table data-bind="template: { name: 'rowTemplate', foreach: myRows, templateOptions: { edit: EditUrl, details: DetailsUrl } }"></table>

---

最简单的方法是通过“options”参数将viewModel或所需的变量传入jQuery模板

我认为您正在使用Knockout，所以您可以做如下操作：

<table data-bind="template: { name: 'rowTemplate', foreach: myRows, templateOptions: { edit: EditUrl, details: DetailsUrl } }"></table>

---

---

你可以发布一个你正在使用的JSON的例子吗？这篇文章也可能会有所帮助-它会帮助你提供更多关于模板

viewModel

的细节，以及来自JSON对象的示例here@FloydPink：添加了完整的示例。您的JSON中似乎缺少一个“]/“}]，“CreateUrl”“@Nicky Waites:可能是在我清理额外数据时。它真的没有丢失。你能举一个你正在使用的JSON的例子吗？此外，本文可能会有所帮助—提供更多关于模板

viewModel

的详细信息以及json对象中的示例也会有所帮助here@FloydPink：添加了完整的示例。您的JSON中似乎缺少一个“]/“}]，“CreateUrl”“@Nicky Waites:可能是在我清理额外数据时。它确实没有丢失。@RP Niemeyer：当我为模板选项添加该部分时，它会中断，并且根本不会渲染。我使用的是1.1.2 knockout.jsI，我看到你更新了你的问题。我的答案的唯一变化是EditUrl和DetailsUrl是可观察的，所以您需要执行

模板选项：{edit:EditUrl（），details:DetailsUrl（）}

。另外，请确保您使用的是Knockout 1.2（不是1.12）@RP Niemeyer:Knockout.mapping.js插件有新版本吗？当前的映射插件代码中有一些修复程序，另一个提示：如果指定templateOptions，请确保它的右大括号和模板绑定的右大括号之间有一个空格。如果您使用}}，那么jQuery模板就会变得混乱。@RP Niemeyer：当我为模板选项添加该部分时，它会中断，并且根本不会渲染。我使用的是1.1.2 knockout.jsI，我看到你更新了你的问题。我的答案的唯一变化是EditUrl和DetailsUrl是可观察的，所以您需要执行

模板选项：{edit:EditUrl（），details:DetailsUrl（）}

。另外，请确保您使用的是Knockout 1.2（不是1.12）@RP Niemeyer:Knockout.mapping.js插件有新版本吗？当前的映射插件代码中有一些修复程序，另一个提示：如果指定templateOptions，请确保它的右大括号和模板绑定的右大括号之间有一个空格。如果您使用}}，那么jQuery模板就会混淆。

$( "#myTemplate" ).tmpl(yourData, { option1: value1, option2: value2 }).appendTo( "#target") );