Question

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

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=string%3Ap&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-repeat中添加了$ index索引。在过滤器之前添加时，它会向表中添加一堆空行。在过滤器后插入时，没有变化。

Answer 1

当名称显示有重复的索引值时，会收到错误[ngRepeat:dupes]。

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

这也将解决空行

如果您认为您的回答是正确形成的，请尝试粘贴您正在接收的内容的调试

Answer 2

您的两次服务电话之间存在竞争条件。无论最后完成的是将其结果分配给$ scope.topics。我假设对用户服务的调用应如下所示：

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

Answer 3

应在track by $index中的所有其他表达式之后添加

ngRepeat。来自Angular docs：

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

我怀疑你在最后添加你的曲目表达时会看到空行（而不是你问题中指出的另一种方式）。这很可能意味着您的topics数组中有空或未定义的对象。

我建议您检查从工厂方法收到的数据。

Angular ngRepeat：dupes错误（尽管没有重复的密钥）

3 个答案: