6

Sono bloccato su qualcosa di abbastanza semplice, credo, quindi ho bisogno di alcune competenze per aiutarmi a raggiungere questo compito.Dizionario dizionario Knockout Js MVC

Ho un dizionario che accetta un numero intero e una stringa come valori per memorizzare un elenco di risultati (che mostrerò di seguito). My View Model e Controller hanno questo codice, che inviare i dati come una stringa JSON alla Knockout:

[Codice per ViewModel]

public class ResultModel 
{ 
    public Dictionary<int, string> dictResult { get; set; } 
    public string dictResultJson { get; set; } 

    public ResultModel() 
    { 
     dictResult = new Dictionary<int, string>(); 
    } 
} 

[Codice per il file cshtml]

<h2>Results</h2> 
<table> 
    <tbody data-bind="template: { name: 'tblResult', foreach: dictResultJson() }"></tbody> 
</table> 

<script id="tblResult" type="text/html"> 
    <tr> 
     <td data-bind="value: key"></td> 
     <td data-bind="value: value"></td> 
    </tr> 
</script> 

<script type="text/javascript"> 
    var ResultModel = function(m) { 
     var self = this; 
     self.dictResultJson = ko.observableArray(mapDictionaryToArray(m.DictJson)); 
    }; 

    function mapDictionaryToArray(dictionary) { 
     var result = []; 
     for (var key in dictionary) { 
      if (dictionary.hasOwnProperty(key)) { 
       result.push({ key: key, value: dictionary[key] }); 
      } 
     } 

     return result; 
    } 

    var data = @(Html.Raw(Json.Encode(Model))); 
    var dataFromServer = ko.utils.parseJson(data.dictResultJson); 
    console.log(dataFromServer); 

    ko.applyBindings(new ResultModel(dataFromServer)); 
    console.log("apply binding"); 
</script> 

Nel mio file cshtml sto analizzando l'oggetto restituito da MVC Controller e convertendolo in un array. Ora il problema è che non sta visualizzando alcun dato, ma la variabile dataFromServer contiene dati corretti. Ha questi dati:

oggetto {1: "Kate", 3: "Alex", 4: "Jane"}

Ora, come faccio a ciclo questo JSON Risultato per visualizzarla in un formato tabella, come

tabella

1 Kate

3 Alex

4 Jane

Grazie in anticipo

Jesmond

+1

A mio avviso è la migliore idea di attuare "mapDictionaryToArray" sul lato server. Il codice compilato funziona molto più velocemente, giusto? – RredCat

risposta

2

Se si desidera visualizzare i valori della tabella come testo è necessario utilizzare il text binding invece di value

<tr> 
    <td data-bind="text: key"></td> 
    <td data-bind="text: value"></td> 
</tr> 

E c'è un altro problema con il vostro codice. Quando si chiama new ResultModel(dataFromServer) il numero dataFromServer contiene già i dati nel formato corretto. Quindi non è necessario m.DictJson nella funzione ResultModel:

var ResultModel = function(m) { 
     var self = this; 
     self.dictResultJson = ko.observableArray(mapDictionaryToArray(m)); 
}; 
+0

Grazie mille, ha perfettamente senso! – user1889181

Problemi correlati