如何在 JSRender 中动态呈现数组条目答案

【问题标题】：How do you render Arrays entries dynamically in JSRender如何在 JSRender 中动态呈现数组条目
【发布时间】：2012-06-25 16:06:20
【问题描述】：

我正在使用 jQuery mobile 和 jsRender 来模板化一些 JSON 对象。

我在 jQuery mobile 中创建了一个列表视图，它输出：

<li><a href="#product-detail" data-ID="2" data-array="0">Product A</a></li>
<li><a href="#product-detail" data-ID="5" data-array="2">Product B</a></li>
<li><a href="#product-detail" data-ID="8" data-array="3">Product C</a></li>

单击（点击）列表链接时，我希望呈现产品详细信息页面，该页面由特定于数组的产品信息和一些顶级 JSON（与语言相关）组成。

<h2 id="h2test">{{:productArray[0].Title}}</h2>
 <div class="row">
  <div class="from-column">
   <div class="from">{{:language.products.from}}</div>
    <div class="price">£929.99</div>
   </div>
  <a href="#" class="buy-now">{{:language.products.buyNow}}</a>
</div>

模板还有很多内容，其中包括更多特定于数组的产品信息和语言内容。

如何动态访问 {{:productArray[0].Title}}？即为 productArray 节点渲染传递的变量？

谢谢，

尼克

【问题讨论】：

标签： jsrender

【解决方案1】：

我不确定我是否理解您的问题。如果您的意思是让用户点击/单击列表中的产品，然后显示该产品的详细信息，那么听起来您需要使用 JsViews。看一下live JsViews samples，以及对应的代码，包括this one

JsViews 进行数据绑定，允许您“可观察地”更改数据对象和数组，因此更改会在呈现的模板中自动更新。它允许您从点击事件获取相应的视图对象和它所针对的数据项。

【讨论】：