UI di loop Kendo attraverso raccolta in Json all'interno del modello per ListView

Question

Sto cercando di capire all'interno di un modello di interfaccia utente Kendo per una visualizzazione elenco come loop attraverso una raccolta all'interno di ogni oggetto per rendere le informazioni sulla pagina. Ecco un esempio di JSON sto giocando con:

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

voglio rendere le voci coppie di chiavi nel modello e solo un avendo qualche problema a capire come.

Qui è la fonte:

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

Sono sicuro che sto solo overthinking questo, ed è qualcosa di riduttivo, ma non è sicuro come implementare il ciclo foreach nel modello per Kendo UI di riconoscere esso.

Grazie in anticipo!

Answer 1

Si può fare questo con un contatore nel ciclo for. Questo dovrebbe risolvere il problema:

<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

Si può avere il codice JavaScript arbitrario all'interno di un template:

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