ng-repeater问题不允许在中继器中重复

我正在尝试创建一个如下所示的表格，这在角度中使用ng-repeat指令，并且每当我创建一个新行时，都会发出抱怨 “重复节点中的副本不是允许的。“ng-repeater问题不允许在中继器中重复

enter image description here

虽然我知道这种情况的解决方案是“由$索引道”推杆，但是它会导致另一个问题，其点击删除一行删除其他字段的值。所以我怀疑，通过索引进行追踪对于静态文本而言是可以的，但对于输入形式来说是不错那么如何正确使用ng-repeat来处理我的情况呢？请参阅我的JSFiddle进行演示。

我当前的代码：

HTML

<div class="row-fluid spacer10"> 
    <a ng-click="addAKA()" class="btn btn-primary spacer5 left30"><i class="icon-plus icon-white"></i> Add New Alias</a> 
</div> 
<div class="row-fluid spacer10"></div> 
<div class="row-fluid spacer5" ng-repeat="item in aliasList track by $index"> 
    <input type="text" class="span6 left30" ng-model="item"> 
    <button class="btn btn-danger" ng-click="deleteAKA($index)">delete</button> 
    <BR/> 
</div>

的Javascript

$scope.addAKA = function() 
{ 
    if($scope.aliasList == null) 
    { 
     $scope.aliasList = []; 
    } 
    $scope.aliasList.push(""); 
    $scope.aliasjson = JSON.stringify($scope.aliasList); 
} 


$scope.deleteAKA = function (idx) 
{ 
    var aka_to_delete = $scope.aliasList[idx]; 
    $scope.aliasList.splice(idx, 1); 
    $scope.aliasjson = JSON.stringify($scope.aliasList); 
}

来源

2013-10-10 Rudy

你能检查$ index是基于0还是基于1。如果$ index是1，那么你需要做'splice（idx-1,1）;'否则它应该工作。 – Chandermani

$ index总是以角度为基础。看到我的jsfiddle – Rudy

只要改变你迭代的方式。取而代之的是：

<div ng-repeat="item in aliasList track by $index">

做到这一点：

<div ng-repeat="item in aliasList">

$index将里面的元素仍然可以使用，这样使用：

<button ng-click='deleteItem($index)'>Delete</button>

一个正确的解决方案请参见本JSFiddle

来源

2013-10-10 07:53:21

您的方法存在多个问题。

由于您直接将字符串绑定到ng模型，并且ng-repeat创建子作用域，所以对该值的任何更改都不会反映回来。改变你的范围模式类似

$scope.list = [{text:"one"},{text:"two"}];

，并结合i.text，而不是因为你先前做结合i。

deleteItem方法是使用item而不是index来调用的。看我这里的小提琴

http://jsfiddle.net/JS6aJ/1/

来源

2013-10-10 07:57:58 Chandermani

ng-repeater问题不允许在中继器中重复

回答

相关问题