सशर्त रूप से किसी वस्तु को अवलोकनीय सरणी में कैसे धकेलें?


103

मैं pushएक आइटम पर एक नया आइटम चाहूंगा observableArray, लेकिन केवल अगर आइटम पहले से मौजूद नहीं है। क्या नॉकआउट जेएस में इसे प्राप्त करने के लिए कोई "खोज" फ़ंक्शन या अनुशंसित पैटर्न है?

मैंने देखा है कि removeएक पर समारोह observableArrayएक हालत में पारित करने के लिए एक समारोह प्राप्त कर सकते हैं। मैं लगभग समान कार्यक्षमता चाहता हूं, लेकिन केवल यह धक्का देने के लिए कि क्या हालत पारित हुई है या सच नहीं है।

जवाबों:


223

एक नमूदारअरे एक 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);
}

क्या यह itemToAdd पर सभी गुणों की तुलना करता है? मुझे केवल एक Id प्रॉपर्टी के लिए परीक्षण करना होगा।
जफ्फा

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

4
बहुत बढ़िया टिप, लेकिन मुझे आइटम को बदलना पड़ा। मैंने अगले उत्तर में अपना कोड पोस्ट किया।
राके ३६

1
@ Rake36 यह इस बात पर निर्भर करेगा कि क्या आपको लगता है कि आपकी आइटम आईडी कभी बदल जाएगी और उसे देखने योग्य होने की आवश्यकता है।
लुई

1
@ क्षेत्रवासी - आप किस मुद्दे पर === हैं? क्या आपके पास नमूना है? क्या आप संख्याओं या किसी चीज़ से तार की तुलना कर रहे हैं?
RP नीमेयर

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

मैं परिवर्तन से पहले "valueWillMutate ()" और उनके बाद "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();
}
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.