Duplicate ng-repeat with track by

783 Views Asked by At

How to allow duplicate in ng-repeat with track by and update ng-repeat list from controller ?

By using track by $index i am not able to update scope variable, but i want to allow duplicate object in ng-repeat

Condition : 1) allow duplicate in ng-repeat 2) use track by 3) update ng-repeat list from controller

HTML

<div>
    <ng-repeat="question in pagedata.questions track by $index"> 
            <p>{{question.questionText}}<p>
        <div ng-repeat="option in question.optionList track by $index">
                <p ng-click="changeNextQuestion(question.nextQuestionId)">{{option}}</p>
        </div>

</div>

Controller

  $scope.pagedata.questions = [
     {
        "questionId" : 1
        "questionText" : "A"
        "optionList" : [A1, A2, A3],
        "nextQuestionId"  : 2

     },
     {
        "questionId" : 2
        "questionText" : "B"
        "optionList" : [B1, B2, B3],
        "nextQuestionId"  : 2
     },
 {
        "questionId" : 3
        "questionText" : "C"
        "optionList" : [C1, C2, C3],
        "nextQuestionId"  : 2
     }
    ];
$scope.pagedata.questionsBack = angular.copy($scope.pagedata.questions);

$scope.changeNextQuestion = function(nextQuestionId){
    var nextQuestion = findNextQuestionIndex($scope.pagedata.questions, nextQuestionId);
    $scope.pagedata.questions[0] = $scope.pagedata.questionsBack[nextQuestion];
    });
//I want to update view with new value.
}


}
2

There are 2 best solutions below

0
On

Add 'track by $index' to the ng-repeat.

More info please see this link https://docs.angularjs.org/error/ngRepeat/dupes

4
On

You check this one. I hope this one is very helpful for you.

In controller

var studentsList = [
    {"Id": "101", "name": "siva"},
    {"Id": "101", "name": "siva"},
    {"Id": "102", "name": "hari"},
    {"Id": "103", "name": "rajesh"},
    {"Id": "103", "name": "rajesh"},
    {"Id": "104", "name": "ramesh"},
];

 var uniqueStandards = UniqueArraybyId(studentsList ,"id");

 function UniqueArraybyId(collection, keyname) {
  var output = [], 
  keys = [];

  angular.forEach(collection, function(item) {
    var key = item[keyname];
    if(keys.indexOf(key) === -1) {
      keys.push(key);
      output.push(item);
    }
  });
  return output;
};