兩個選擇列表共享相同的值綁定，更新速度慢

我有兩個選擇列表綁定到包含相同數據的不同排序的可觀察數組。這兩個選擇列表值綁定都是相同的observableArray。兩個選擇列表共享相同的值綁定，更新速度慢

HTML

<select id="countriesAZ" data-bind="value: selectedCountry, options: countriesAZ, optionsText: 'Name', optionsValue: 'Id', optionsCaption: 'Countries a - z'"></select> 

    <select id="countriesByDistance" data-bind="value: selectedCountry, options: countriesDist, optionsText: 'Name', optionsValue: 'Id', optionsCaption: 'Countries by distance'"></select>

var myVM = function() { 
    var self = this; 
    this.countriesAZ = ko.observableArray([{"Id":1,"Name":"Scotland"},{"Id":2,"Name":"England"},{"Id":3,"Name":"Wales"},{"Id":4,"Name":"N. Ireland"}]); 
    this.countriesDist = ko.observableArray([{"Id":1,"Name":"Scotland"},{"Id":2,"Name":"England"},{"Id":3,"Name":"Wales"},{"Id":4,"Name":"N. Ireland"}]); 
    this.selectedCountry = ko.observableArray(); 
} 

window.viewModel = new myVM(); 
ko.applyBindings(viewModel);

在this fiddle這一切似乎運作良好，並迅速作出反應，然而，實際的陣列有大約1000個項目，有一個延遲當改變其中一個選擇時。

我試圖把價值綁定，但似乎沒有區別。

來源

2013-03-01 Paul McCowat

您確定它是Knockout，這是此處的瓶頸嗎？它可能只是瀏覽器渲染它。你有沒有使用開發人員工具進行分析？就個人而言，無論如何，從可用性的角度來看，我強烈建議不要有1000個長的下拉菜單。 – 2013-03-01 12:11:53

當使用由options綁定生成的大量選項時，還會遇到性能問題，同時還會使用綁定value。 Ryan Niemeyer在this blog post中描述了這個問題。他還解釋瞭解決此問題的多種方法。

雖然最簡單的修復方法可能是使用我的Freedom plugin修復了底層的Knockout錯誤。以下是您的示例，其中包含Freedom插件：http://jsfiddle.net/mbest/sHatN/3/

來源

2013-03-02 02:56:08

謝謝你。我先看過ryans網站，但沒有找到。 – 2013-03-02 18:02:06

兩個選擇列表共享相同的值綁定，更新速度慢

回答

相關問題