在jQuery模板中获取当前项索引的最简单的方法

前端之家收集整理的这篇文章主要介绍了在jQuery模板中获取当前项索引的最简单的方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我传递一个对象数组到jQuery模板(官方jquery-tmpl插件):
$("#itemTmpl").tmpl(items).appendTo("body");

<script id="itemTmpl" type="text/x-jquery-tmpl">
    <div class="item">Name: ${name},Index: ${???}</div>
</script>

在模板中显示项目索引的最简单的方法是什么?优选地,不使用分离的外部函数,而不改变传递的对象结构,并且不改变模板结构(转换为{{each}})。是否有任何内置变量可能存储当前数组索引?

更新
我创建了a ticket建议公开数组索引模板项,但它被关闭作为无效…

解决方法

好吧,它不是一个真正的单独的外部函数,但你可以拍一个函数到选项对象,你可以传递给tmpl。我做了以下和它工作正常:
$("#templateToRender").tmpl(jsonData,{
    dataArrayIndex: function (item) {
      return $.inArray(item,jsonData);
    }
  });

在模板中,您可以从$ item对象访问函数

<script id="templateToRender" type="text/x-jquery-tmpl">
  <li>
    Info # ${$item.dataArrayIndex($item.data)}
  </li>
</script>

或者,不是将$ item.data传递给函数函数的上下文是模板的tmplItem对象(与$ item.data相同)。所以你可以写dataArrayIndex作为无参数,并通过this.data访问数据。

猜你在找的jQuery相关文章