如何在AngularJs中使用ng-repeat重复重复的对象?

杜尔加·西瓦·基肖尔·莫普鲁

这是我的代码。

$scope.data=[];
$scope.data=[{"label":"name","type":"string"},{"label":"email","type":"string"}];
$scope.addFields = function (field) {
   $scope.data.push(field);
  };

这是我的html:-

<div ng-repeat="eachItem in data">
<input type="button" value="add" ng-click="addFields(eachItem)"/>
    <label>{{eachItem.label}}</label>
    <input type="text" ng-model="fieldValue"/>
</div>

当我点击添加按钮时,将另一个对象推入$scope.data数组

 $scope.data=[{"label":"name","type":"string"},{"label":"email","type":"string"},{"label":"name","type":"string"}];

在上面我有一个错误

angular.min.js:102 Error: [ngRepeat:dupes] http://errors.angularjs.org/1.3.14/ngRepeat/dupes?p0=nestedField%20in%20fie…%2C%22type%22%3A%22string%22%2C%22%24%24hashKey%22%3A%22object%3A355%22%7D
at Error (native)

添加后,我有重复的对象。因为我想在angularjs中使用ng-repeat重复标签名称。首先我有这样的输出

输出:

name   textbox
email  textbox

添加按钮后,单击输出:-

name   textbox
email  textbox
name   textbox
哈迪J

使用$ index跟踪

var app = angular.module("app",[])
app.controller('ctrl',['$scope', function($scope){
       $scope.data=[];
$scope.data=[{"label":"name","type":"string"},{"label":"email","type":"string"}];
$scope.addFields = function (field) {
   $scope.data.push(field);
  };
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<div class="item item-checkbox">
   <div ng-repeat="eachItem in data track by $index">
<input type="button" value="add" ng-click="addFields(eachItem)"/>
    <label>{{eachItem.label}}</label>
    <input type="text" />
</div>    
</div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

删除对象中的重复键的AngularJS ng-repeat问题

AngularJS-如何在ng-repeat中重复tr

如何在选择 angularjs 中使用重复

如何避免使用ng-repeat重复项目并丢弃angularjs?

AngularJS:如何在ng-repeat中使用$索引

如何在ng-repeat angularjs中使用多重响应?

如何在angularjs中使用ng-repeat

如何在angularjs中使用ng-repeat和array时创建对象

AngularJS:如何在 HTML 中使用两个 ng-repeat 显示深度对象值

对象angularjs的重复

AngularJS重复对象数组

AngularJS,ng-repeat不重复

在对象上重复时,如何获取ng-repeat中element的$ index?

如何在AngularJS中使用ng-repeat动态生成ng-model =“ my _ {{$ index}}”“?

如何在angularjs中使用ng-click显示ng-repeat的确切内容

Angularjs表头不断重复(使用ng-repeat)

如何在Angular JS的重复中间停止ng-repeat

AngularJS NG-repeat:如何在必须过滤唯一值的ng-repeat中重复数据

如何在AngularJS中不重复子代但将父代与ng-repeat绑定

ng-repeat重复问题,如果没有任何重复

angularJs ng - 在 json 对象数组上重复

AngularJS重复数组与对象

如何在AngularJs中使用ng-repeat过滤(键,值)?

如何在AngularJS中使用ng-repeat遍历键和值?

如何在AngularJS ng-repeat中使用ES6 Map

如何在 angularjs 中使用 ng-repeat 时显示特定项目内的数据?

如何在angularjs中使用ng-repeat遍历JavaScript Maps?

如何在Angularjs中使用ng-repeat复选框过滤表

如何在AngularJS中使用ng-repeat插入html代码?