javascript - $ index跟踪显示太多结果

所以我从Angular收到以下错误：

Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys.

因此，通过执行以下操作修复了该问题：

rooster in rooster.uren track by $index

但是这样做是创建了很多面板，而我的jSon只有4行。

JS：

angular.module("PixelFM").controller("grootRoosterController", function ($http) {
    var that = this;
    that.uren = [];
    $http({
        method: 'GET',
        url: '/assets/scripts/GROOTROOSTERTEST.json'
    }).success(function(data) {
        that.uren = data;
    });
});

重复的html重复：

<div class="col-md-6" ng-repeat="rooster in rooster.uren track by $index">
    <div class="panel panel-default">
        <div class="panel-body grootrooster">
            {{rooster.name}}
        </div>
    </div>
</div>

出于某种奇怪的原因，此代码的作用是输出一百万个面板，这些面板都保持为空...

这怎么可能？谢谢。

编辑

杰森

[
    {"host": "Adjuh5", "showname": "", "hour": "1446674064", "cohost": "Finicky"},
    {"host": "Beatgrid", "showname": "", "hour": "1446674064", "cohost": ""},
    {"host": "Adjuh5", "showname": "", "hour": "1446674064", "cohost": ""},
    {"host": "Finicky", "showname": "", "hour": "1446674064", "cohost": ""}
]

最佳答案

为我工作！检查您的通话$ http并更改：

angular.module("PixelFM").controller("grootRoosterController", function ($http) {
    var that = this;
    that.uren = [];
    $http({
        method: 'GET',
        url: '/assets/scripts/GROOTROOSTERTEST.json'
    }).success(function(data) {
        that.uren = data;
    });
});

至：

angular.module("PixelFM").controller("grootRoosterController", function ($scope, $http) {
   $scope.rooster = {uren:[];
    $http({
        method: 'GET',
        url: '/assets/scripts/GROOTROOSTERTEST.json'
    }).success(function(data) {
        $scope.rooster.uren = data;
    });
});

angular.module('app', []).controller('mainCtrl', function($scope) {

  $scope.rooster = {
    uren: [{
      "host": "Adjuh5",
      "showname": "",
      "hour": "1446674064",
      "cohost": "Finicky"
    }, {
      "host": "Beatgrid",
      "showname": "",
      "hour": "1446674064",
      "cohost": ""
    }, {
      "host": "Adjuh5",
      "showname": "",
      "hour": "1446674064",
      "cohost": ""
    }, {
      "host": "Finicky",
      "showname": "",
      "hour": "1446674064",
      "cohost": ""
    }]
  };
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller='mainCtrl'>
  <hr/>Quick-Ng-Repeat
  <hr/>
  <div ng-repeat="rooster in rooster.uren">
    <div class="panel panel-default">
      <div class="panel-body grootrooster">
        {{rooster.host}}
      </div>
    </div>
  </div>
</div>

关于javascript - $ index跟踪显示太多结果，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33543481/