我希望这很简单。我正在尝试将数组中的最后一个对象再次添加到数组中。
像这样:
arr = [1, 2]
result = [1, 2, 2]
只需使用此代码即可:
$scope.template = {
ressource: {
level: [{
gain: [],
cost: []
}]
}
};
$scope.addLevel = function() {
var last = $scope.template.ressource.level[$scope.template.ressource.level.length - 1];
$scope.template.ressource.level.push(last);
};
但是我收到了这个错误:
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: level in template.ressource.level, Duplicate key: object:51, Duplicate value: {"gain":[],"cost":[]}
编辑
所以我尝试了 track by
但我似乎没有得到任何新东西所以这里是我代码的 HTML
部分我使用 gain
和 cost
值:
<div ng-show="template.type === 'building'" class="vertical-spacing">
<label>Ressource gain per level</label>
<ul class="list-group">
<li ng-repeat="level in template.ressource.level track by $id(level)"
class="list-group-item"
ng-hide="template.ressource.level.indexOf(level) === 0">
<span>
Level: {{ template.ressource.level.indexOf(level) }}
</span>
<span class="pull-right">
<a href="" ng-click="removeLevel(level)">
<span class="glyphicon glyphicon-remove"></span>
</a>
</span>
<ul>
<li class="list-group-item" ng-repeat="gain in level.gain track by $id(gain)">
<div class="form-inline">
<div class="form-group">
<label>Amount</label>
<input type="number"
class="form-control"
ng-model="gain.amount"
min="1"
required>
</div>
<div class="form-group">
<label>Ressource</label>
<select required
ng-model="gain.ressource"
ng-init="gain.ressource = gain.ressource || ressources.basic[0]"
ng-options="ressource._id as ressource.name | capitalize for ressource in ressources.basic"
class="form-control selectWidth">
<option style="display:none" value="" disabled>select a ressource</option>
</select>
</div>
<span class="pull-right">
<a href="" ng-click="removeGain(level, gain)">
<span class="glyphicon glyphicon-remove"></span>
</a>
</span>
</div>
</li>
</ul>
<span>
<a href="" ng-click="addGain(level)" ng-hide="(level.gain.length + 1) > ressources.basic.length">
<span class="glyphicon glyphicon-plus"></span> Add ressource
</a>
</span>
</li>
</ul>
<span>
<a href="" ng-click="addLevel()">
<span class="glyphicon glyphicon-plus"></span> Add level
</a>
</span>
</div>
<div ng-show="template.type === 'building'" class="vertical-spacing">
<label>Ressource cost per level</label>
<ul class="list-group">
<li ng-repeat="level in template.ressource.level track by $id(level)"
class="list-group-item"
ng-hide="template.ressource.level.indexOf(level) === 0">
<span>
Level: {{ template.ressource.level.indexOf(level) }}
</span>
<span class="pull-right">
<a href="" ng-click="removeLevel(level)">
<span class="glyphicon glyphicon-remove"></span>
</a>
</span>
<ul>
<li class="list-group-item" ng-repeat="cost in level.cost track by $id(cost)">
<div class="form-inline">
<div class="form-group">
<label>Amount</label>
<input type="number"
class="form-control"
ng-model="cost.amount"
min="1"
required>
</div>
<div class="form-group">
<label>Ressource</label>
<select required
ng-model="cost.ressource"
ng-init="cost.ressource = cost.ressource || ressources.categories[0]"
ng-options="ressource._id as ressource.name | capitalize for ressource in ressources.categories"
class="form-control selectWidth">
<option style="display:none" value="" disabled>select a ressource</option>
</select>
</div>
<span class="pull-right">
<a href="" ng-click="removeCost(level, cost)">
<span class="glyphicon glyphicon-remove"></span>
</a>
</span>
</div>
</li>
</ul>
<span>
<a href="" ng-click="addCost(level)" ng-hide="(level.cost.length + 1) > ressources.categories.length">
<span class="glyphicon glyphicon-plus"></span> Add ressource
</a>
</span>
</li>
</ul>
<span>
<a href="" ng-click="addLevel()">
<span class="glyphicon glyphicon-plus"></span> Add level
</a>
</span>
</div>
错误现在指出:
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: level in template.ressource.level track by $id(level), Duplicate key: object:51, Duplicate value: {"gain":[],"cost":[]}
最佳答案
你有一个 Angular 错误。在你的 ng-repeat 中使用 track by
。
<div ng-repeat="n in template.ressource.level track by $index">
引用
By default, ngRepeat does not allow duplicate items in arrays. This is because when there are duplicates, it is not possible to maintain a one-to-one mapping between collection items and DOM elements.
If you do need to repeat duplicate items, you can substitute the default tracking behavior with your own using the track by expression.
关于javascript - 复制要添加到同一数组的最后一个数组对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29820164/