我在页面上有两个表单。第一个项目向数据库添加项目,第二个项目预先填充数据,并允许用户修改项目。第一种形式允许用户动态创建和删除子项......
<div class="clonableSubItem__inputContainer" ng-repeat="name in item.sub_items track by $index">
<input type="text" class="form__textInput__field subItem" ng-model="item.sub_items[$index]">
<input type="button" ng-click="addRow($index)" value="Add" ng-show="$last">
<input type="button" ng-click="deleteRow($event, $index)" value="Delete" ng-show="$index != 0">
</div>
...和角度
$scope.item.sub_items = [""];
$scope.addRow = function(index) {
var name = "";
if($scope.item.sub_items.length <= index+1) {
$scope.item.sub_items.splice(index+1, 0, name);
}
};
$scope.deleteRow = function(event, index) {
if(event.which == 1) {
$scope.item.sub_items.splice(index, 1);
}
};
第二种形式看起来几乎相同......
<li ng-repeat="name in item.sub_items track by $index">
<input class="subItem" type="text" ng-init="name=name" value="{[{ name }]}" ng-model="item.sub_items[$index]">
<input type="button" ng-click="addRow($index)" value="Add" ng-show="$last">
<input type="button" ng-click="deleteRow($event, $index)" value="Delete" ng-show="$index != 0">
</li>
我认为我可以使用相同的功能来添加和删除预先填充的sub_items,但是单击这些按钮只会添加和删除第一个表单中的sub_items。在jQuery中,我很可能会在.each()中使用“this”。这里似乎范围之间存在冲突。如何重用这些功能,但是它是否能在正确的项目上运行?