Angular ngRepeat:重复错误(尽管没有重复的密钥）

Angular ngRepeat: dupes error (although there are no duplicate keys)

本文关键字：密钥 ngRepeat 错误 Angular      更新时间：2023-09-26

我正在学习MEAN，遇到了一个角度错误。我试图在表格中显示表单数据，但数据没有通过，我收到的错误是：

angular.js:11500错误：[ngRepeat:dupes]http://errors.angularjs.org/1.3.5/ngRepeat/dupes?p0=topic%20in%20topics%20%20%7C%20filter%3A%20filter_q&p1＝字符串%3Map&p2=p错误（本机）在

在index.html文件中，我有：

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重复中按$index添加了音轨。当添加到筛选器之前时，它会向表中添加一堆空行。在过滤器之后插入时，没有任何变化。

您的两个服务调用之间存在竞争条件。无论最后一个完成，都会将结果分配给$scope.topics。我认为对用户服务的调用应该是这样的：

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

当名称表明存在重复的索引值时，会收到错误[ngRepeat:dupes]。

我建议您使用简单的console.log(output);调试在$http.post中接收的数据。记住，序列化ng重复数组是防止重复错误的好方法。

这将解决空行太

如果您认为您的响应格式正确，请尝试粘贴一个关于您收到的调试

track by $index应添加在ngRepeat中的所有其他表达式之后。来自Angular文档：

注意：track by必须始终是最后一个表达式

我怀疑，当你的track-by-expression被添加到最后时，你会看到空行（而不是像你的问题中指出的那样）。这很可能意味着topics数组中有空的或未定义的对象。

我建议你检查一下你从工厂收到的数据。

相关文章：