嵌套淘汰赛 foreach 模板

Question

我正在尝试嵌套一些 jQuery 模板。我知道 jQuery 有我可以使用的 {{tmp 语法，但这对我不起作用，因为我需要使用敲除的 foreach 模板。正如您在下面看到的，我有一个绑定到第一个脚本标签的 div。这是我的第一个模板，使用敲除的 foreach 语法循环通过可观察的消息数组。在该模板中，我试图将另一个 div 绑定到另一个模板，该模板使用淘汰赛的 foreach 循环遍历“消息”数组的每个成员中的数组。它不工作。我收到 javascript 错误（如“预期标识符”）。知道我做错了什么吗？

     <div data-bind="template: {name: 'contactIMSTemplateContent', foreach:messages}"></div>
 <script id="contactIMSTemplate" type="text/html">
    <span class="tabTop">${viewModel.contacts()[$data.contact].name()}</span>
 </script>
             <script id="contactIMSTemplateContent" type="text/html">
    <div class="tabContentIM" >
    <div data-bind="template: {name:'IMSTemplate', foreach:${viewModel.messages()[$data.contact].ims}}" ></div>

    </div>
             </script>
 <script id="IMSTemplate" type="text/html">

      <div class="message"><span class="messageFrom">${viewModel.contacts()[0].name()}</span> ${$data}</div>
 </script>

我的视图模型看起来像：

var viewModel = {
    contacts: ko.observableArray([new contact("Contact Name", "contact status", "busy", "e@t.com", "url")]),
    messages: ko.observableArray([{
        contact: 0,
        ims: new ko.observableArray(["chat"])
    }])
};

Answer 1

我不知道你的 viewModel 到底长什么样，但是这行会导致问题：

<div data-bind="template: {name:'IMSTemplate', foreach:${viewModel.messages()[$data.contact].ims}}" ></div>

在data-bind里面，可以直接使用变量，不需要使用${语法。此外，在属性的末尾有一个}}，这将导致 jQuery 模板插件尝试将其解析为标签。如果您需要在数据绑定中放置两个大括号，那么只需在它们之间放置一个空格即可。