2011-09-13 4 views
15

KnockoutJS'yi kullanarak bir sözlük koleksiyonunu seçili bir listeye bağlama.KnockoutJS - Bir sözlük koleksiyonuna veritabani

benim "Hedefler" Sözlük JSON bu gibiyse

{"Europe":"Europe incl Egypt, Turkey & Tunisia","ANZO":"Australia & New Zealand","WorldwideUSA":"Worldwide (incl USA & Canada)"} 

nasıl seçkin bir listeye bu bağlama yoktur. Böyle bir şey:

data_bind="value: Destination, options: Destinations.Value, optionsText: Destinations.Key" 

cevap

25

Tipik bir sözlükle uğraşırken, anahtar/değer özellikleri olan nesneleri içeren bir dizi eşlemek isteyecektir.

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

    return result; 
} 

Numune burada: http://jsfiddle.net/rniemeyer/7yDTJ/

+0

Ryan, nasıl sözlükten bir değer seçimini önceden yapmak? Kemanınızda selectedDestination: ko.observable ("ANZO") değerini ekledim ve ikinci öğe önceden seçilmedi. – user583066

+0

Örnekte 'optionsValue: 'value'' vardır, bu nedenle anahtar yerine değer beklenmektedir. Örneği güncelledim: http://jsfiddle.net/rniemeyer/7yDTJ/ –

+0

Eşleme eklentisine bakarım http://knockoutjs.com/documentation/plugins-mapping.html –

4

Daha basit seçeneği demolar bir jsfiddle var Sunucudaki bir dizi için sözlük ve dizi döndürün:

Dictionary<string, string> myDict = ... ; 
return myDict.toArray(); // returns KeyValuePair<string, string>[] 
Şimdi

kolayca nakavt dizi bağlayabilir ...

<select class="form-control" 
    data-bind="options: opts, optionsText: 'Value', optionsValue: 'Key', optionsCaption: 'Show All', value: filter.myVal"> 
</select>