टेम्पलेट्स में से एक के लिए एक observableArray छंटाई

Question

मैं निम्न दृश्य मॉडल है:

ko.observableArray([new instance(...), new instance(...), ...] 

निम्नलिखित टेम्पलेट के साथ:

function instance(id, FirstName){ 
    $.extend(this, { 
     id: ko.observable(id || ''), 
     FirstName: ko.observable(FirstName || '') 
    }); 
} 

मैं एक observableArray में कुछ उदाहरणों है

<ul data-bind='template: {name: "instanceTemplate", foreach: instances}'></ul> 

और एक और टेम्पलेट:

<ul data-bind='template: {name: "anotherInsTmpl", foreach: instances}'></ul> 

पहले ul मैं छंटाई के बिना टेम्पलेट्स रेंडर करने के लिए, दूसरा एक में की जरूरत में प्रथम के अनुसार क्रमबद्ध रेंडर।

क्या कोई इसे समझा सकता है?

Answer 1

एक विकल्प एक निर्भर ऑब्सर्जेबल को जोड़ना होगा जो क्रमबद्ध सरणी का प्रतिनिधित्व करता है। यह कुछ ऐसा दिखाई देगा:

viewModel.sortFunction = function(a, b) { 
     return a.FirstName().toLowerCase() > b.FirstName().toLowerCase() ? 1 : -1; 
}; 

viewModel.sortedInstances = ko.dependentObservable(function() { 
    return this.instances.slice().sort(this.sortFunction); 
}, viewModel); 

तो, प्रत्येक मद के नमूदार FirstName के मूल्य का एक केस संवेदी तुलना करते हैं। सरणी (स्लाइस (0)) की एक प्रति लौटाएं जो सॉर्ट किया गया है (असली सरणी को सॉर्ट नहीं करना चाहते हैं)।

यहाँ नमूना: ko.dependentObservable अब ko.computed है: नॉकआउट संस्करण 2.0 और अधिक से अधिक के बारे में http://jsfiddle.net/rniemeyer/93Z8N/

नोट। Dependent Observables