jquery - 计算项目 jquery 模板

Question

如何计算每个 jquery 模板中的项目并将 if 应用于该变量

类似的东西

<script id="inventorySummaryTmpl" type="text/x-jquery-tmpl"> 
<tr>
{{each response}}
    {{if response.length === 2 }}
        </tr><tr>
    {{/if}}
        <td><img src='${icon}'> ${title} </td>
{{/each}}

</tr>

这是加载 JSON 并与 jquery.TMPL 交互的 javascript

 var ip = window.location.hash;


    var request = $.ajax({
        type: 'GET',
        url: 'ajax/dashboard/widgets/inventorySummary.xsp?ip='+ip.substring(1),
        dataType: 'json'
    });

    request.done(function(data){
        $("#inventorySummaryTmpl").tmpl(data).appendTo("#inventorySummaryContent");
    });

    request.fail(function(jqXHR, textStatus, errorThrown) {
        console.log(errorThrown);
        console.log(textStatus)
    });

和 JSON

{

"response": [
    {
        "icon": "workstation",
        "nbItems": "38",
        "title": "Workstations"
    },
    {
        "icon": "server",
        "nbItems": "2",
        "title": "Servers"
    }
]

}

如果有人有任何想法。

Answer 1

你们已经很接近了。 each 语句中的变量需要是您要循环的完整集合。您还可以传递集合中每个项目的索引和值的自定义变量名称。根据您的代码，以下内容应该有效，但如果您发布了集合的结构，我们就能够确保它有效

<script id="inventorySummaryTmpl" type="text/x-jquery-tmpl"> 
<tr>
    {{each(index,resp) responses}}
        {{if resp.length === 2 }}
            </tr><tr>
        {{/if}}
        <td><img src='${resp.icon}'> ${resp.title} </td>
    {{/each}}
</tr>

jQuery 文档:http://api.jquery.com/template-tag-each/

更新

现在我已经更新了我的解决方案，因为我明白了您的需求。如果您想在 response 数组中每三个(或六个或其他)元素之后启动一个新的 ul(或 tr)，请选中当前元素的索引，而不是完整响应数组的长度。

<script id="inventorySummaryTmpl" type="text/x-jquery-tmpl"> 
  <ul>
    {{each(i,el) response}}
      {{if (i > 0 && i % 3 === 0) }}
        </ul><ul>
      {{/if}}
      <li class="inventoryWrap">
        <img src='blueprint/images/wrap/icons/${icon}.png' class="inventoryPic"> 
        <span class="inventoryCount">${el.nbItems}</span> 
        <span class="inventoryText">${el.title}</span>
      </li>
    {{/each}}
  </ul>
</script>

演示:http://jsfiddle.net/jackwanders/ZzddF/1/