Angular ngRepeat：重複エラー（重複するキーはありません）

Question

私は覚えていますが、角度エラーが発生しました。しかし私は、データが通過していないされ、テーブル内のフォームデータを表示しようとしていると私は受信エラーがある：私が持っているindex.htmlファイルで

angular.js:11500 Error: [ngRepeat:dupes] http://errors.angularjs.org/1.3.5/ngRepeat/dupes?p0=topic%20in%20topics%20%20%7C%20filter%3A%20filter_q&p1=string%3Ap&p2=p at Error (native) at

：

discussion_board.controller('dashboardController', function($scope, usersFactory, topicsFactory){ 
     $scope.topics = []; 
     $scope.users = []; 

     topicsFactory.index(function(data){ 
     $scope.topics = data; 
     }) 

     usersFactory.index(function(data){ 
     $scope.topics = data; 
     }) 

     $scope.addtopic = function(){ 
     console.log("from controller)"); 
     topicsFactory.addTopic($scope.new_topic, function(topics){ 
      $scope.topics = topics; 
      $scope.new_topic = {}; 
     }); 
     } 
    }) 
discussion_board.factory('topicsFactory', function($http){ 
    var factory = {}; 
    var users = []; 

    factory.index = function(callback) { 
     $http.get('/topics').success(function(output){ 
     callback(); 
     }); 
    } 

    factory.addTopic = function(info, callback) { 
     console.log("from factory"); 
     $http.post('/topics', info).success(function(output){ 
     callback(); 
     }); 
    } 

そして、ビューファイルの中で：

<div ng-controller="dashboardController"> 
<h2>Welcome {{username}} !</h2> 
<h5>Search: 
    <input type="text" ng-model="filter_q" placeholder="search"> 
</h5> 
<table class="table"> 
    <tr> 
     <th>Category</th> 
     <th>Topic</th> 
     <th>User Name</th> 
     <th>Posts</th>  
    </tr> 
    <tr ng-repeat="topic in topics | filter: filter_q"> 
     <td>{{topic.category}}</td> 
     <td>{{topic.name}}</td> 
     <td>{{topic.username}}</td> 
     <td>{{topic.posts}}</td> 
    </tr> 

</table> 

ng-repeatで$ indexでトラックを追加しました。フィルタの前に追加すると、空の行がテーブルに追加されます。フィルターの後に挿入すると、変更はありません。

Answer 1

2つのサービスコールの競合状態があります。最後に終了したものは結果を$ scope.topicsに割り当てます。

usersFactory.index(function(data){ 
    $scope.users= data; 
}) 

Answer 2

名前が示すように繰り返しインデックス値がある場合は、エラー番号[ngRepeat:dupes]が返されます。

$ http.postで受け取ったデータを単純にconsole.log(output);でデバッグすることをお勧めします。ng-repeat配列をシリアライズすることは、偽のエラーを防ぐための良い習慣です。あなたは正確にあなたが

Answer 3

track by $indexが供給されているもののデバッグを貼り付けるためにあなたの応答が正しく形成されている試みがngRepeat内の他のすべての式の後に追加されるべきであると思われる場合は、あまりにも

を空の行を解決します

。 Angular docsから：

Note: track by must always be the last expression

私は表現することにより、あなたのトラックが最後に追加されたとき（円形ではない他の方法をあなたの質問で指摘したように）あなたが空の行を参照してください疑うでしょう。これは、配列topicsに空または未定義のオブジェクトがある可能性が最も高いです。

返品するデータを工場出荷時の方法で検査することをお勧めします。