Kendo UI döngü içinde Json içinde şablon içinde ListView için

Question

Bir liste görünümü için bir Kendo UI şablon içinde anlamaya çalışıyorum, sayfadaki bilgileri işlemek için her nesne içindeki bir koleksiyonda nasıl döngü yapılacağını. İşte ile oynuyorum json bir örnektir:

{"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} 

ben şablonda keypairs öğeleri işlemek istiyorum ve sadece bir nasıl anlamakta güçlük çekiyor. İşte

kaynağıdır: Ben sadece bu overthinking eminim

<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> 

ve Kendo UI tanıması için şablonda foreach döngüsü nasıl uygulanacağı emin şey basit, ama değil o.

Şimdiden teşekkürler!

Answer 1

Sen for-döngüsünde bir sayaç ile yapabilirsiniz.

<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> 

değerlerimi var

Answer 2

Bir şablonu içinde keyfi JavaScript kodu olabilir:

<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>