सहयोगी सरणी के लिए ko.observableArray समर्थन

Question

क्या अवलोकन योग्य और सहयोगी सरणी मिश्रण करने के लिए कोई बेहतर (अंतर्निहित?) तरीका है?

viewModel = { 
    a: ko.observableArray(), 
    a_assoc: {}, 
    add_item: function(i) { 
     if (typeof this.a_assoc[i] == 'undefined') { 
      this.a.push(i); 
      this.a_assoc[i]=1; 
     } 
    } 
} 

viewModel.add_item('bla'); 

Answer 1

आमतौर पर, आप नॉकआउट में कुछ इस तरह करना होगा:

var viewModel = { 
    a: ko.observableArray(["a","b","c","d"]), 
    add_item: function() { 
     this.a.push("new" + this.a().length); 
    } 
}; 

viewModel.a_assoc = ko.dependentObservable(function() { 
    var result = {}; 
    ko.utils.arrayForEach(this.a(), function(item) { 
     result[item] = 1; 
    }); 
    return result; 
}, viewModel); 

तो, आप एक dependentObservable है कि एक वस्तु के लिए अपने सरणी नक्शे की है। ध्यान दें कि प्रत्येक बार जब मूल सरणी अद्यतन की जाती है, तो वस्तु का पुनर्निर्माण किया जाता है। इसलिए, यह आपकी पोस्ट की विधि से कम कुशल है, लेकिन जब तक कि आपका ऑब्जेक्ट काफी बड़ा न हो, यह संदिग्ध है कि इससे प्रदर्शन समस्या होगी।

यहाँ नमूना: http://jsfiddle.net/rniemeyer/PgceN/

Answer 2

मुझे लगता है कि यह सबसे अच्छा है प्रदर्शन के लिए हुड के नीचे एक साहचर्य सरणी का उपयोग करें। परिवर्तनों को ट्रैक करने में सक्षम होने के लिए आप (जैसा कि आपने बताया है) एक अवलोकन योग्य ऐरे का उपयोग करने की आवश्यकता है (क्योंकि यह है कि कैसे नॉकआउट काम करता है)।

यदि आप 'नॉकआउट फ्रेंडली' एसोसिएटिव सरणी की तलाश में हैं तो आप शायद आइटम में बदलावों को ट्रैक करने का एक तरीका चाहते हैं (और इस प्रकार निर्भरता श्रृंखलाओं को प्रभावित करते हैं)।

http://jsfiddle.net/rz41afLq/2/

यहाँ मुझे लगता है कि मेरी जरूरतों के अनुकूल के साथ आया है। असल में आप observableArray में एक महत्वपूर्ण मूल्य जोड़ी संग्रहीत करते हैं और लुकअप उद्देश्यों के लिए प्रतिलिपि संग्रहीत करने के लिए एक मानक सहयोगी सरणी का उपयोग करते हैं। यदि आप कुत्ते की सूची पर pop() या push() बुला और यूआई अद्यतन करना चाहते योजना बना रहे हैं

update_item('dogs', ['kim', 'abbey', 'goldie', 'rover']); 
update_item('dogs', ko.observableArray(['kim', 'abbey', 'goldie', 'rover'])); 

(दूसरा केवल आवश्यक है आप:

// VIEW MODEL 
var viewModel = { 

    // we have to use observable array to track changes 
    items: ko.observableArray([]), 

    // also use associative array for performance 
    _assoc: {}, 

    update_item: function(key, value) { 

     // use a true assoc array for performance 
     // _assoc[key] = ko.observable(value) 
     if (viewModel._assoc[key]) 
     { 
      // update observable (overwriting existing item) 
      viewModel._assoc[key].value(value); 
     } 
     else { 
      // Important: See how we wrap value with an observable to detect changes 
      this.items.push(viewModel._assoc[key] = { key: key, value: ko.observable(value) }); 
     } 
    } 
}; 

तो तुम इस तरह अपने कुत्ते को बचाने के। निश्चित रूप से किसी भी समय आइटम को पूरी तरह अद्यतन करने के लिए update_item पर कॉल कर सकते हैं, जिस स्थिति में इसे देखने योग्य नहीं होना चाहिए)

कोई मूल्य देखने के लिए, आप गतिशील रूप से इसे लाने के लिए गणना की जाती हैं:

var dogs = getValue('dogs'); 

फिर जैसे ही साहचर्य सरणी परिवर्तन तो नमूदार dogs() अद्यतन करेगा (और श्रृंखलित जा सकता है) में 'कुत्तों' के रूप में सूचीबद्ध मूल्य के रूप में। यह dogs देखने योग्य यूआई के लिए

var getValue = function(key) { return ko.pureComputed(function() 
{ 
    // reevaluate when item is added or removed to list 
    // not necessary if the value itself changes 
    viewModel.items();              

    var item = viewModel._assoc[key]; 
    return (item == null) ? null : item.value(); 

}, viewModel);