首页 文章

角度ng重复错误“不允许在转发器中重复” .

提问于
浏览 次
444

我正在定义一个自定义过滤器：

<div class="idea item" ng-repeat="item in items" isoatom>    
    <div class="section comment clearfix" ng-repeat="comment in item.comments | range:1:2">
        ....
    </div>
</div>

正如您所看到的那样，使用过滤器的ng-repeat嵌套在另一个ng-repeat中

过滤器的定义如下：

myapp.filter('range', function() {
    return function(input, min, max) {
        min = parseInt(min); //Make string input int
        max = parseInt(max);
        for (var i=min; i<max; i++)
            input.push(i);
        return input;
    };
});

我越来越：

错误：不允许在转发器中重复 . Repeater：在item.comments中发表评论|范围：1：2 ngRepeatAction @ https：//ajax.googleapis.com/ajax/libs/angularjs/1.1.4/an

angularjs ng-repeat

10 回答

  • 911

    不允许在转发器中重复 . 使用'track by'表达式指定唯一键 .

    Repeater: {0}, Duplicate key: {1}, Duplicate value: {2}

    例

    <!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="angular.js"></script>

</head>
<body>
    <div ng-app="myApp" ng-controller="personController">
        <table>
            <tr> <th>First Name</th> <th>Last Name</th> </tr>
            <tr ng-repeat="person in people track by $index">
                <td>{{person.firstName}}</td>
                <td>{{person.lastName}}</td>
                <td><input type="button" value="Select" ng-click="showDetails($index)" /></td>
            </tr>

        </table> <hr />
        <table>
            <tr ng-repeat="person1 in items track by $index">
                <td>{{person1.firstName}}</td>
                <td>{{person1.lastName}}</td>
            </tr>
        </table>
        <span>   {{sayHello()}}</span>
    </div>
    <script> var myApp = angular.module("myApp", []);
        myApp.controller("personController", ['$scope', function ($scope)
        { 
            $scope.people = [{ firstName: "F1", lastName: "L1" },
                { firstName: "F2", lastName: "L2" }, 
                { firstName: "F3", lastName: "L3" }, 
                { firstName: "F4", lastName: "L4" }, 
                { firstName: "F5", lastName: "L5" }]
            $scope.items = [];
            $scope.selectedPerson = $scope.people[0];
            $scope.showDetails = function (ind) 
            { 
                $scope.selectedPerson = $scope.people[ind];
                $scope.items.push($scope.selectedPerson);
            }
            $scope.sayHello = function ()
            {
                return $scope.items.firstName;
            }
        }]) </script>
</body>
</html>
    回复于
  • 0

    如果在<ul>标记内调用ng-repeat，则可以允许重复 . 请参阅此链接以供参考 . See Todo2.html

    回复于
  • 42

    该解决方案实际上在这里描述：http://www.anujgakhar.com/2013/06/15/duplicates-in-a-repeater-are-not-allowed-in-angularjs/

    AngularJS不允许在ng-repeat指令中使用重复项 . 这意味着如果您尝试执行以下操作，则会出现错误 .

    // This code throws the error "Duplicates in a repeater are not allowed.
// Repeater: row in [1,1,1] key: number:1"
<div ng-repeat="row in [1,1,1]">

    但是，稍微更改上面的代码以定义索引以确定下面的唯一性将使其再次工作 .

    // This will work
<div ng-repeat="row in [1,1,1] track by $index">

    官方文档在这里：https://docs.angularjs.org/error/ngRepeat/dupes

    回复于
  • 1

    为了防止其他人发生这种情况，我在这里记录这个，我收到了这个错误，因为我错误地将ng-model设置为与ng-repeat数组相同：

    <select ng-model="list_views">
     <option ng-selected="{{view == config.list_view}}"
         ng-repeat="view in list_views"
         value="{{view}}">
         {{view}}
     </option>
 </select>

    代替：

    <select ng-model="config.list_view">
     <option ng-selected="{{view == config.list_view}}"
         ng-repeat="view in list_views"
         value="{{view}}">
         {{view}}
     </option>
 </select>

    我检查了数组，没有任何重复，只需仔细检查你的变量 .

    回复于
  • 0

    对于那些期望JSON并仍然得到相同错误的人，请确保解析数据：

    $scope.customers = JSON.parse(data)
    回复于
  • 4

    如果使用SharePoint 2010时发生此错误：重命名.json文件扩展名并确保更新restService路径 . 不需要额外的“追踪$ index” .

    幸运的是，我将这个_288844转发给了这个理由：

    .json成为SP2010中的重要文件类型 . SP2010包含某些Web服务 endpoints . 这些文件的位置是14hive \ isapi文件夹 . 这些文件的扩展名是.json . 这就是它给出这样一个错误的原因 . “只关心json文件的内容是json - 而不是它的文件扩展名”

    Once the file extensions are changed, should be all set.

    回复于
  • 10

    我在我的项目中遇到了一个问题，我在$ index中使用了ng-repeat track，但是当数据来自数据库时，产品没有得到反映 . 我的代码如下：

    <div ng-repeat="product in productList.productList track by $index">
  <product info="product"></product>
 </div>

    在上面的代码中，product是一个单独的指令来显示product.But我知道$ index在我们从作用域传递数据时会引起问题 . 因此数据丢失和DOM无法更新 .

    我通过使用product.id作为ng-repeat中的键来找到解决方案，如下所示：

    <div ng-repeat="product in productList.productList track by product.id">
  <product info="product"></product>
 </div>

    但是当多个产品具有相同的ID时，上面的代码再次失败并抛出以下错误：

    angular.js:11706 Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater

    所以最后我通过制作ng-repeat的动态唯一键来解决问题，如下所示：

    <div ng-repeat="product in productList.productList track by (product.id + $index)">
  <product info="product"></product>
 </div>

    这解决了我的问题，并希望这将在未来帮助你 .

    回复于
  • -1

    您希望“范围”过滤器做什么？

    以下是我认为你要做的工作样本：http://jsfiddle.net/evictor/hz4Ep/

    HTML：

    <div ng-app="manyminds" ng-controller="MainCtrl">
  <div class="idea item" ng-repeat="item in items" isoatom>    
    Item {{$index}}
    <div class="section comment clearfix" ng-repeat="comment in item.comments | range:1:2">
      Comment {{$index}}
      {{comment}}
    </div>
  </div>
</div>

    JS：

    angular.module('manyminds', [], function() {}).filter('range', function() {
    return function(input, min, max) {
        var range = [];
        min = parseInt(min); //Make string input int
        max = parseInt(max);
        for (var i=min; i<=max; i++)
            input[i] && range.push(input[i]);
        return range;
    };
});

function MainCtrl($scope)
{
    $scope.items = [
        {
            comments: [
                'comment 0 in item 0',
                'comment 1 in item 0'
            ]
        },
        {
            comments: [
                'comment 0 in item 1',
                'comment 1 in item 1',
                'comment 2 in item 1',
                'comment 3 in item 1'
            ]
        }
    ];
}
    回复于
  • -1

    不允许在转发器中重复 . 使用'track by'表达式指定唯一键 . Repeater：sydtail in mydt，Duplicate key：string :, Duplicate value：

    我遇到了这个错误，因为我在我的php api部分写了错误的数据库名称......

    因此，当您从数据库库中获取数据时，也可能发生此错误，数据库库的名称写错了 .

    回复于
  • 0

    我的 JSON 回复是这样的：

    {"items": 
  &nbsp;[
    &nbsp;&nbsp;{
      "index": 1,
      "name": "Samantha",
      "rarity": "Scarborough",
      "email": "maureen@sykes.mk"
    },
    &nbsp;&nbsp;{
      "index": 2,
      "name": "Amanda",
      "rarity": "Vick",
      "email": "jessica@livingston.mv"
    }]
}

    所以，我用 ng-repeat = "item in variables.items" 来显示它 .

    回复于

相关问题