Error coming up while using ng-repeat for a array in javascript

Question

I am stuck at this issue while running my code

<div ng-model="activeFilterCtrl.selectedfilters" ng-repeat="filters in activeFilterCtrl.selectedfilters" ng-model-options="{trackBy: '$value.params'}" flex>
      <md-button name="mylabel" ng-click="activeFilterCtrl.clearvalue()">{{filters.params}}</md-button>
</div>

I keep getting this error.

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

Please provide the solution Following is the value of selected filter

selected filter value is [{"params":"min","value":5}, {"params":"max","value":30}]

The message explicitly says "Use 'track by' expression to specify unique keys". Also this question has been asked many times before. Please search before asking. — str
– str, Commented Jul 11, 2016 at 8:30
Possible duplicate of Angular ng-repeat Error "Duplicates in a repeater are not allowed." — str
– str, Commented Jul 11, 2016 at 8:31

Sa E Chowdary · Accepted Answer · 2016-07-11 08:28:32Z

1

try with this

 ng-repeat="filters in activeFilterCtrl.selectedfilters track by $index"

answered Jul 11, 2016 at 8:28

Sa E Chowdary

2,09518 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Blu · Accepted Answer · 2016-07-11 08:41:55Z

Try this Demo Link

HTML

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link href="style.css" rel="stylesheet" />
    <script data-semver="1.4.9" src="https://code.angularjs.org/1.4.9/angular.js" data-require="[email protected]"></script>
    <script src="app.js"></script>
  </head>

  <body ng-app="plunker" ng-controller="MainCtrl as activeFilterCtrl">
  <div ng-model="activeFilterCtrl.selectedfilters" ng-repeat="filters in activeFilterCtrl.selectedfilters" ng-model-options="{trackBy: '$value.params'}" flex>
      <md-button name="mylabel" ng-click="activeFilterCtrl.clearvalue()">{{filters.params}}</md-button>
</div>
  </body>

</html>

JS

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  var vm = this;

  vm.selectedfilters = [{"params":"min","value":5}, {"params":"max","value":30}]
});

Collectives™ on Stack Overflow

Error coming up while using ng-repeat for a array in javascript

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related