templates - Windows 8 JS 和 html5 应用程序 - 模板中的 foreach

Question

如何WinJS.Binding.Template在我的WinJS.UI.ListView控制范围内循环遍历项目？

我的数据：

{ category: 'Sports', 
  items: [
    { title: 'soccer'}, { title: 'tennis'}
  ] 
}

我想在我的模板中做什么：

<div id="myTmpl" data-win-control="WinJS.Binding.Template" style="display:none">
  <h1 data-win-bind="innerText: category"></h1>
  <div data-win-REPEATER="each: items">
    <span data-win-bind="innerText: title"></span>
  </div>
</div>

Answer 1

因为你想嵌套项目的细节，我建议你看看我对另一个问题的回答，这个问题非常相似：

WinJS ListView 和模板绑定

这包含所有基本细节。

也就是说，你没有理由不能在这里集成 JQuerys 模板——你只需要找到一种方法让它们与 WinJS 模板/控制合同一起工作。

Answer 2

你检查过吗

http://code.msdn.microsoft.com/windowsapps/ListView-basic-usage-sample-fcc451db

通常循环是自动的（它将根据数据源信息进行）

<div id="listView" 
        class="win-selectionstylefilled"
        data-win-control="WinJS.UI.ListView" 
        data-win-options="{ 
            itemDataSource: myData.dataSource, 
            itemTemplate: myTmpl, 
            selectionMode: 'none', 
            tapBehavior: 'none', 
            swipeBehavior: 'none', 
            layout: { type: WinJS.UI.GridLayout } 
        }"
    ></div>