KEY UI pętli kolekcji w Json w ramach szablonu dla ListView

Question

Próbuję dowiedzieć się w szablonie Kendo UI dla widoku listy, w jaki sposób pętli kolekcji w każdym obiekcie, aby wyświetlić informacje na stronie. Oto przykład z json gram z:

{"Data":[{"Title":"Malicious Acts","KeyPairs":{"Key1":"12","Key2":"24"}},   {"Title":"Enrollments","KeyPairs":{"Key1":"12","Key2":"24"}},{"Title":"Customer Feedback","KeyPairs":{"Key1":"12","Key2":"24"}},{"Title":"Questionable Accounts","KeyPairs":{"Key1":"12","Key2":"24"}}],"Total":4,"AggregateResults":null,"Errors":null} 

Chcę uczynić elementy KeyPairs w szablonie i tylko pewne kłopoty ze zrozumieniem sposobu.

Oto źródło:

<div id="subscriberFunctions"> 

    <script type="text/x-kendo-tmpl" id="template"> 
     <div class="subscriberFunction"> 
      <h3>${Title}</h3> 
      <!-- Display KeyPairs --> 
     </div> 
    </script> 

    @(Html.Kendo().ListView<SubscriberMenuFunction>() 
     .Name("listView") 
     .TagName("div") 
     .ClientTemplateId("template") 
     .DataSource(dataSource => 
     { 
      dataSource.Read(read => read.Action("SubscriberMenu", "ListView")); 
     }) 
     .Selectable(selectable => selectable.Mode(ListViewSelectionMode.Single)) 

    ) 
</div> 

Jestem pewien, że jestem po prostu overthinking to, i to jest coś proste, ale nie wiem, jak wdrożyć pętlę foreach w szablonie dla Kendo UI rozpoznać to.

Z góry dziękuję!

Answer 1

Można to zrobić za pomocą licznika w pętli for. To powinno rozwiązać problem:

<script type="text/x-kendo-tmpl" id="template"> 
<div class="subscriberFunction"> 
    <h3>${Title}</h3> 
    <!-- Display KeyPairs --> 
    <ul> 
     #for (var i=0,len=KeyPairs.length; i<len; i++){# 
      <li>${ KeyPairs[i] }</li> 
     # } # 
    </ul> 
</div> 

Answer 2

Można mieć dowolny kod JavaScript wewnątrz szablonu:

<script type="text/x-kendo-tmpl" id="template"> 
    <div class="subscriberFunction"> 
     <h3>${Title}</h3> 
     <!-- Display KeyPairs --> 
     <ul> 
     # for (var key in KeyPairs) { # 
       <li>${ KeyPairs[key] }</li> 
     # } # 
     </ul> 
    </div> 
</script>