मैं किसी ऑब्जेक्ट को सरणी में कैसे बदल सकता हूं जो ng-repeat का उपयोग करके प्रदर्शित होता है?

Question

मेरे पास एनजी-दोहराने का उपयोग कर तालिका में प्रदर्शित वस्तुओं की एक श्रृंखला है। जब आप किसी आइटम पर क्लिक करते हैं, तो वह आइटम सर्वर से खींचा जाता है और तालिका को अद्यतन आइटम के साथ अद्यतन किया जाना चाहिए।

$scope.getUpdatedItem = function(item){ 
    itemService.getItem(item).then(
     function(updatedItem){ 
      item = updatedItem; 
     }, 
     function(error){ 
      //Handle error 
     } 
    ); 
}; 

मैं का उपयोग कर आइटम प्रदर्शित कर रहा हूँ:

<tr ng-repeat="item in myItems"> 

समस्या: मद में टेबल है जब तालिका में आइटम पर क्लिक

समारोह अद्यतन आइटम प्राप्त करने के लिए कभी अपडेट नहीं किया

एनजी-दोहराने में आइटम को अपडेट करने का सबसे अच्छा तरीका क्या है? क्या मैं इसके लिए एनजी-दोहराने में "$ सूचकांक द्वारा ट्रैक" का उपयोग कर सकता हूं? या क्या मुझे उस आइटम को ढूंढने के लिए अपने आईटम्स पर फिर से शुरू करना है जिसे मैं प्रतिस्थापित करना चाहता हूं?

अद्यतन:

var index = $scope.myItems.indexOf(item); 
$scope.myItems[index] = updateItem; 

हालांकि, मुझे लगता है कि वहाँ एक "स्वच्छ" होना चाहिए:

सम्भावित समाधान के बजाय

item = updatedItem,

का उपयोग कर का उपयोग करने की है ऐसा करने का तरीका।

Answer 1

कोई क्लीनर तरीका नहीं है (फिर आपका अपडेट)। जैसा कि आपने देखा है, जब आप अपने कॉलबैक फ़ंक्शन में item बदलते हैं तो आप स्थानीय संदर्भ बदलते हैं, न कि मूल में मूल आइटम।

<div ng-click="getUpdatedItem(item, $index)"> </div> 

और अपने नियंत्रक में:

आप इस ng-repeat से $index का उपयोग कर के बजाय, यह अपने आप की गणना के द्वारा एक सा सुधार कर सकते हैं

$scope.getUpdatedItem = function(item, index){ 
    itemService.getItem(item).then(
    function(updatedItem){ 
     $scope.myItems[index] = updateItem; 
    }, 
    function(error){ 
     //Handle error 
    } 
    ); 
}; 

तुम भी angular.copy बजाय उपयोग कर सकते हैं लेकिन यह बहुत कम कुशल है:

function(updatedItem){ 
    angular.copy(updateItem, item); 
}, 

Answer 2

अगर मैं आपकी समस्या को ठीक से

सकता है

कुछ इस काम की तरह समझते हैं?

<!-- template code --> 
<table> 
    ... 
    <tr ng-repeat="(index, item) in items"> 
     <td>{{item.name}}</td> 
     <td> 
      {{item.detail}} 
      <button ng-if="!item.detail" ng-click="loadItem(index)"> 
     </td> 
    </tr> 
</table> 

// Controller Code 
$scope.items = [...] 
$scope.loadItem = function(index){ 
    itemService.getItemDetail($scope.items[index]).then(function(itemDetail){ 
     $scope.items[index].detail = itemDetail; 
    }); 
}; 

Answer 3

item अपने सूची में किसी आइटम के लिए एक संदर्भ के रूप में शुरू हो सकता है, लेकिन जब आप कहते हैं:

item = updatedItem; 

आप आरोपित है कि बंधन - आप अब आइटम के लिए सूची में बात कर रहे हैं, लेकिन आपके वादे में वापस आने वाले डिस्कनेक्ट करने के लिए। या अगर यह बहुत बालों हो जाता है, तो आप एक वस्तु सरणी है कि और अधिक इस तरह दिखता है पर विचार हो सकता

function(updatedItem){ 
    item.varA = updatedItem.varA 
    item.varB = updatedItem.varB 
    ... 
} 

,:: या तो तुम इतनी तरह, आइटम को संशोधित करने की आवश्यकता होगी

var items = [ 
    { data: item1 }, 
    { data: item2 }, 
    { data: item3 } 
}; 

जिसके बाद आपके अद्यतन फ़ंक्शन इस तरह दिखेगा:

function(updatedItem){ 
    item.data = updatedItem; 
}, 

Answer 4

मैंने अभी इस मुद्दे पर घंटे बिताए हैं। मैं @ladcon से $index समाधान का उपयोग नहीं कर सका, क्योंकि मेरे ng-repeat ने फ़िल्टर का भी उपयोग किया था, अगर पंक्तियों/वस्तुओं को फ़िल्टर किया गया है तो इंडेक्स सही नहीं है।

मैंने सोचा कि मैं सिर्फ यह करने के लिए सक्षम हो जाएगा:

$filter('filter')($scope.rows, {id: 1})[0] = newItem; 

लेकिन वह काम नहीं करता।

जब तक मुझे कोई मिलान नहीं मिला, तब तक सरणी को फिर से समाप्त कर दिया गया और फिर को पुनरावृत्ति से (ng-repeat से नहीं) को सरणी आइटम को नए आइटम पर सेट करने के लिए समाप्त किया गया।

// i'm looking to replace/update where id = 1 
angular.forEach($scope.rows, function(row, $index) { 
    if (row.id === 1) { 
    $scope.rows[$index] = newItem; 
    } 
}) 

यहाँ देखें: https://codepen.io/anon/pen/NpVwoq?editors=0011