Angular两种形式,两个ng-click,相同的功能,只有第一个运行

时间:2017-01-23 16:42:54

标签: jquery angularjs angularjs-scope angularjs-ng-click

我在页面上有两个表单。第一个项目向数据库添加项目,第二个项目预先填充数据,并允许用户修改项目。第一种形式允许用户动态创建和删除子项......

<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”。这里似乎范围之间存在冲突。如何重用这些功能,但是它是否能在正确的项目上运行?

0 个答案:

没有答案