2014-11-05 4 views
5

मैं एनजी-दोहराना, के साथ एक कोड का परीक्षण कर रहा हूं लेकिन कोणीय के पुराने संस्करण के साथ, यह काम करता है, लेकिन नवीनतम संस्करण के साथ यह काम नहीं करता है!एनजी-दोहराना आइटम जोड़ें (AngularJs 1.2.26)

मैं समझाता:

मैं इस कोड का परीक्षण:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.0/angular.js"></script> 

<div ng-app="myApp"> 
    <div ng-controller="MyCtrl"> 
     <ul> 
      <li ng-repeat="item in items">{{item}}</li> 
     </ul> 
     <input ng-model="newItem" type="text"></input> 
     <button ng-click="add(newItem)">Add</button> 
    </div> 
</div> 

<script> 
var app = angular.module('myApp', []); 

app.controller('MyCtrl', function($scope) { 
    $scope.items = ["A", "B", "C", "D"]; 
    $scope.add = function(item) { 
     $scope.items.push(item); 
    }; 

}); 
</script> 

जब मैं severarls आइटम जोड़ने के लिए, यह ठीक काम करता है! angular.js/1.1.0 संस्करण के साथ यह एक नया आइटम

लेकिन नवीनतम संस्करण के साथ यह काम नहीं करता है! हम एक आइटम जोड़ सकते हैं, लेकिन हम एक से अधिक आइटम जोड़ते हैं, तो यह इस त्रुटि बनाता है:

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: item in items, Duplicate key: string:d

तो मेरे सवाल है कि हम कैसे खबर संस्करणों के साथ एनजी-दोहराने में समाचार आइटम जोड़ सकते हैं?

धन्यवाद!

+1

जवाब सवाल में है! :) यहां 'ट्रैक द्वारा' का उपयोग करें, जैसे: http://stackoverflow.com/questions/26232764/angularjs-nested-ng-repeat-array-in-object-only-works-if-there-is-one-item -इन/26232889 # 26232889 – Cherniv

उत्तर

10

कृपया यहाँ देख https://docs.angularjs.org/error/ngRepeat/dupes

अपने ng-repeattrack by $index यानी करने के लिए जोड़ें:

<li ng-repeat="item in items track by $index"> 

नीचे डेमो:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp"> 
 
    <div ng-controller="MyCtrl"> 
 
     <ul> 
 
      <li ng-repeat="item in items track by $index">{{item}}</li> 
 
     </ul> 
 
     <input ng-model="newItem" type="text"></input> 
 
     <button ng-click="add(newItem)">Add</button> 
 
    </div> 
 
</div> 
 

 
<script> 
 
var app = angular.module('myApp', []); 
 

 
app.controller('MyCtrl', function($scope) { 
 
    $scope.items = ["A", "B", "C", "D"]; 
 
    $scope.add = function(item) { 
 
     $scope.items.push(item); 
 
    }; 
 

 
}); 
 
</script>

2

यह काम करता है, लेकिन यदि आप सरणी में पहले से मौजूद एक कुंजी जोड़ते हैं, तो यह अद्वितीय वस्तुओं को पहचानने में सक्षम नहीं है (क्योंकि वे वही हैं)।

इसे ठीक करने के लिए आप का उपयोग करने के:

<li ng-repeat="item in items track by $index" 

http://jsfiddle.net/v87kgwud/

संबंधित मुद्दे