iHaveTooLearn_ImSoSorry iHaveTooLearn_ImSoSorry - 1 year ago 55
AngularJS Question

ng-repeat doesnt loop thru my array

Hey everybody can somebody please give me a clue what im doing wrong here?

I trying to build a wrapper where every element in my array gets a and a id
But when i loop thru my real array i only get a error with the text: Error: [ngRepeat:dupes] ...

With a fake array i made it works perfect.

MY HTML:

<div class="translaterBox">
<span ng-repeat="person in persons" id="{{person}}">
{{person + " "}}
</span>

<span ng-repeat="text in textWords" id="{{text}}">
{{text + " "}}
</span>
</div>


MY SCRIPT

var app = angular.module('splitScreenApp', []);
app.controller('splitCtrl', function ($scope, $http) {
$scope.translatetText = "Translate Here";

$http.get("getContent.php")
.then(function (response) {
var content = response.data.content;
$scope.content = content;

function splitContentToWords() {
var text;
for(var i = 0; i <= content.length;i++ ){
if(content[i].text){
var text = content[i].text;
}
return text.split(' ');
}

}
$scope.persons = [
'Jack',
'Jill',
'Tom',
'Harvey'
];
$scope.textWords = splitContentToWords();
console.log($scope.textWords);
console.log($scope.persons);
});
});


Thank you really much for your help

Answer Source

When you get an error about dupes from Angular, it is because there are duplicate keys. You can solve this by using track by as seen in the documentation.

Try changing your ng-repeat to:

<span ng-repeat="person in persons track by $index" id="{{person}}">
<span ng-repeat="text in textWords track by $index" id="{{text}}">
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download