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

アイテムの詳細をネストしたいので、非常によく似た別の質問に対する私の回答を確認することをお勧めします。

WinJSListViewとテンプレートバインディング

これにはすべての重要な詳細があります。

とはいえ、ここでJQueryテンプレートを統合できない理由はありません。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>