2011-12-07 12 views
102

मैं pushobservableArray पर एक नया आइटम चाहता हूं, लेकिन केवल तभी जब आइटम पहले से मौजूद नहीं है। क्या KnockoutJS में इसे प्राप्त करने के लिए कोई "ढूंढें" फ़ंक्शन या अनुशंसित पैटर्न है?एक अवलोकन योग्य सरणी में किसी आइटम को सशर्त रूप से कैसे दबाया जाए?

मैंने देखा है कि removeobservableArray पर फ़ंक्शन किसी शर्त में गुजरने के लिए एक फ़ंक्शन प्राप्त कर सकता है। मैं लगभग एक ही कार्यक्षमता चाहता हूं, लेकिन केवल उस स्थिति को धक्का देने के लिए यदि स्थिति में पारित किया गया है या सत्य नहीं है।

उत्तर

221

एक अवलोकन योग्य ऐरे indexOf फ़ंक्शन (ko.utils.arrayIndexOf पर रैपर) का खुलासा करता है। यह तुम क्या करने की अनुमति देता है:

if (myObservableArray.indexOf(itemToAdd) < 0) { 
    myObservableArray.push(itemToAdd); 
} 

दो एक ही वस्तु के लिए एक संदर्भ नहीं हैं वास्तव में और आप कस्टम तुलना तर्क को चलाने के लिए तो आप ko.utils.arrayFirst की तरह उपयोग कर सकते हैं चाहते हैं, तो:

var match = ko.utils.arrayFirst(myObservableArray(), function(item) { 
    return itemToAdd.id === item.id; 
}); 

if (!match) { 
    myObservableArray.push(itemToAdd); 
} 
+0

क्या यह आइटम पर सभी गुणों की तुलना करता है? मुझे केवल एक आईडी संपत्ति के लिए परीक्षण करने की आवश्यकता है। – jaffa

+5

यह जांच करेगा कि दोनों एक ही वस्तु हैं। यदि आपको व्यक्तिगत गुणों की जांच करने की आवश्यकता है, तो आप 'ko.utils.arrayFirst' का उपयोग कर सकते हैं। मैं जवाब में एक नमूना जोड़ दूंगा। –

+4

उत्कृष्ट टिप, लेकिन मुझे itemToAdd.id === item.id को itemToAdd.id() === item.id() में आइटम बदलना पड़ा। मैंने अपना कोड अगले जवाब में पोस्ट किया। – Rake36

11

धन्यवाद आरपी । ऑब्जेक्ट की 'आईडी' प्रॉपर्टी के माध्यम से 'व्यू' प्रॉपर्टी को मेरे व्यू मॉडल के भीतर से वापस करने के लिए अपने सुझाव का उपयोग करने का एक उदाहरण यहां दिया गया है।

self.jobroles = ko.observableArray([]); 

    self.jobroleName = function (id) 
    { 
     var match = ko.utils.arrayFirst(self.jobroles(), function (item) 
     { 
      return item.id() === id(); //note the() 
     }); 
     if (!match) 
      return 'error'; 
     else 
      return match.name; 
    }; 

HTML में, मैं निम्नलिखित ($ माता-पिता यह एक तालिका पंक्ति पाश अंदर जा रहा है की वजह से है) है:

<select data-bind="visible: editing, hasfocus: editing, options: $parent.jobroles, optionsText: 'name', optionsValue: 'id', value: jobroleId, optionsCaption: '-- Select --'"> 
          </select> 
<span data-bind="visible: !editing(), text: $parent.jobroleName(jobroleId), click: edit"></span></td> 
0

एक ko.observableArray

function data(id,val) 
{ var self = this; 
self.id = ko.observable(id); 
self.valuee = ko.observable(val); } 

var o1=new data(1,"kamran"); 
var o2=new data(2,"paul"); 
var o3=new data(3,"dave"); 
var mysel=ko.observable(); 
var combo = ko.observableArray(); 

combo.push(o1); 
combo.push(o2); 
combo.push(o3); 
function find() 
{ 
     var ide=document.getElementById("vid").value;  
     findandset(Number(ide),mysel); 
} 

function indx() 
{ 
    var x=document.getElementById("kam").selectedIndex; 
    alert(x); 
} 

function getsel() 
{ 
    alert(mysel().valuee()); 
} 


function findandset(id,selected) 
{ 
    var obj = ko.utils.arrayFirst(combo(), function(item) { 
    return id=== item.id(); 
}); 
    selected(obj); 
} 

findandset(1,mysel); 
ko.applyBindings(combo); 


<select id="kam" data-bind="options: combo, 
        optionsText: 'valuee', 
        value: mysel, 
        optionsCaption: 'select a value'"> 

        </select> 
<span data-bind="text: mysel().valuee"></span> 
<button onclick="getsel()">Selected</button> 
<button onclick="indx">Sel Index</button> 
<input id="vid" /> 
<button onclick="find()">Set by id</button> 
में एक वस्तु खोज

http://jsfiddle.net/rathore_gee/Y4wcJ/

0

मैं "मूल्य" जोड़ूंगा WillMutate() "परिवर्तन से पहले और" valueHasMutated() "उनके बाद।

for (var i = 0; i < data.length; i++) { 
    var needChange = false; 
    var itemToAdd = data[i]; 
    var match = ko.utils.arrayFirst(MyArray(), function (item) { 
     return (itemToAdd.Code === item.Code); 
    }); 
    if (!match && !needChange) { 
     MyArray.valueWillMutate(); 
     needChange = true; 
    } 
    if (!match) { 
     MyArray.push(itemToAdd); 
    } 
} 
if (needChange) { 
    MyArray.valueHasMutated(); 
} 
संबंधित मुद्दे