ko.utils.array का उपयोग करने के लिए एक अवलोकन

Question

पर पुनरावृत्त करने के लिए प्रत्येक 'अवलोकन योग्य' के 'मूल्य' फ़ील्ड की गणना करने की कोशिश कर रहा हूं। फ़ायरबग कंसोल में: "this.features कार्य नहीं है त्रुटि"

(function(){ 

function objFeatures(name,price) { 
     return { 
      name: ko.observable(name), 
      price: ko.observable(price), 

      removeFeatures: function() { 
       appViewModel.features.remove(this); 
      } 
     } 
    } 

var appViewModel = { 
features: ko.observableArray([ 
      new objFeatures("Feature1", 20), 
      new objFeatures("Feature2", 20) 
     ]), 

grandTotal: ko.computed(function() { 
      var total = 0; 
      ko.utils.arrayForEach(this.features(), function() { 
       total += this.price(); 
      }) 
      return total; 
     }) 
}; 

ko.applyBindings(appViewModel); 

}()); 

जब मैं इस चलाने का प्रयास, मैं एक मिल: मैं कोड निम्नलिखित अब तक की है।

मैं क्या गलत कर रहा हूं?

Answer 1

गणना के दौरान तत्काल अवलोकन योग्य मूल्यांकन का मूल्यांकन किया जाता है। आपके मामले में, appViewModel अभी तक नहीं बनाया गया है और thisappViewModel का प्रतिनिधित्व नहीं करेगा।

इस मामले में this यह सुनिश्चित करने के कई तरीके हैं। यहाँ दो हैं:

1. अपने प्रारंभिक वस्तु शाब्दिक के बाहर यह बनाएँ:

   var appViewModel = { 
       features: ko.observableArray([ 
        new objFeatures("Feature1", 20), 
        new objFeatures("Feature2", 20) 
        ]) 
   }; 
   
   appViewModel.grandTotal = ko.computed(function() { 
       var total = 0; 
       ko.utils.arrayForEach(this.features(), function(feature) { 
        total += feature.price(); 
       }); 
   
       return total; 
   }, appViewModel); 
   

2. एक समारोह में अपने दृश्य मॉडल बनाएं:

   var AppViewModel = function() { 
       this.features = ko.observableArray([ 
        new objFeatures("Feature1", 20), 
        new objFeatures("Feature2", 20) 
       ]); 
   
       this.grandTotal = ko.computed(function() { 
        var total = 0; 
        ko.utils.arrayForEach(this.features(), function(feature) { 
         total += feature.price(); 
        }); 
        return total; 
       }, this); 
   }; 
   
   ko.applyBindings(new AppViewModel());​