डेटा अपडेट करने के लिए $ घड़ी का उपयोग करके,

Question

में प्रतिबिंबित न करने के लिए एनजी-दोहराएं। मेरे पास $scope.raw में खाद्य पदार्थों की एक सूची है और मैं इस डेटा को कॉलम में दिखाना चाहता हूं इसलिए मैं संरचना को थोड़ा बदल रहा हूं। मैं इसे sortStuff() फ़ंक्शन में करता हूं और अद्यतन डेटा को $scope.allfood में संग्रहीत करता हूं।

$scope.$watch('raw', function(){ 
    $scope.allfood = $scope.sortStuff(); 
    console.log($scope.allfood); 
}, true); 

यह जब भोजन के आसपास घसीटा जाता है क्या होता है:: वहाँ एक $ घड़ी कि $scope.raw में sortStuff() हर बार कुछ भी परिवर्तन कॉल (मैं खींचें और ड्रॉप का उपयोग कर रहा भोजन श्रेणी बदलने के लिए) है

receive:function(event, ui) { 
    var issueScope = angular.element(ui.item).scope(); 
    scope.$apply(function() { 
     var recp = _.find(scope.raw, function(lineitem){ 
      return lineitem.name === issueScope.receipe.name; 
     }) 
     recp.cat = scope.col.name; 
    }) 

    $(ui.item).remove(); // remove DOM 
} 

असल में, मैं $scope.raw के अंदर सही वस्तु की खोज करता हूं और भोजन के लिए नई श्रेणी में cat बदलता हूं। मैं डोम तत्व भी हटा देता हूं क्योंकि मैं दृश्य को रीफ्रेश करने के लिए ng-repeat पर गिन रहा हूं। यह ठीक काम करता प्रतीत होता है: $ watch के अंदर console.log दिखाता है कि ऑब्जेक्ट को सही श्रेणी में ले जाया जा रहा है और डेटा दिखता है कि यह कैसा दिखना चाहिए। हालांकि, दृष्टि से, एनजी-दोहराव डेटा को प्रतिबिंबित नहीं करता है।

Here's the jsfiddle।

बी से सी में किसी आइटम को खींचना ठीक काम करता है। ए को बी से खींचकर, बी से दो आइटम गायब हो जाते हैं ... परिणाम बहुत असंगत होते हैं और मुझे नहीं पता कि क्या हो रहा है।

कोई विचार क्या गलत हो रहा है? या शायद ऐसा करने के बेहतर तरीके के लिए कोई सुझाव?

Answer 1

आपके कोड के साथ समस्या यह है कि ng-repeat निर्देश सूची में प्रत्येक तत्व के लिए $$hashKey संपत्ति जोड़ता है। इस संपत्ति का उपयोग डीओएम तत्वों को सरणी तत्वों के साथ जोड़ने के निर्देश द्वारा किया जाता है।

क्योंकि आप संदर्भ के आधार पर तत्वों को पार कर रहे हैं, ng-repeat निर्देश $$hashKey संपत्ति सीधे $scope.raw सरणी की वस्तुओं में लिखता है। $scope.allfood ऑब्जेक्ट में उन्हें डालने से पहले ऑब्जेक्ट्स की प्रतिलिपि बनाना एक साधारण कामकाज है।

_.each($scope.raw, function(recp){ 
    recp = _.clone(recp); 
    switch(recp.cat){ 
     ... 
    } 
}); 

अब ng-repeat अद्यतन करता $scope.allfood की वस्तुओं, जबकि $scope.raw की वस्तुओं अछूता रहते हैं।

अद्यतन बेला देखें:

http://jsfiddle.net/b8Fa7/5/