Angular js删除表格行不起作用

时间:2017-05-15 07:54:35

标签: angularjs html-table

当我删除Angular中的表行时,它会删除索引后的所有行,我想删除细分行。

HTML:

<div>
<table class="table">
    <tr>
        <td>Date of GPA</td>
        <td>Type</td>
        <td>Grade</td>
        <td>Standard GPA</td>
        <td></td>
    </tr>
    <tr ng-repeat="gpa in ctrl.gpatests">
        <td>
            <md-input-container>
                <input ng-model="gpa[$index].date" ui-mask="99/99/9999">
            </md-input-container>
        </td>
        <td>
            <md-select ng-model="gpa[$index].type" ng-required="true">
                <md-option ng-value="item.id" ng-repeat="item in ctrl.dispHsGradYr">{{item.displayName}}</md-option>
            </md-select> 
        </td>
        <td>
            <md-select ng-model="gpa[$index].grade" ng-required="true" >
                <md-option ng-value="item.id" ng-repeat="item in ctrl.dispHsGradYr">{{item.displayName}}</md-option>
            </md-select> 
        </td>
        <td>3.0</td>
        <td><input type="text" ng-model="gpa[$index].id"/>{{$index}}<span ng-click="removeGPAScore(gpa[$index].id)"> x </span></td>
    </tr>
</table>
<button class="md-raised md-primary savebtn md-button md-default-theme" ng-click="addGPAScore()" type="BUTTON" aria-disabled="false">
        <span class="ng-scope">ADD GPA</span>
</button>
{{ctrl.gpatests | json}}
</div>

removeGPAScore,addGPAScore functions

脚本:

$scope.addGPAScore(){
    var data = {};
    data.id ='' ;
    data.date ='' ;
    data.type ='';
    data.grade ='';
    data.gpaValue ='';
    ctrl.gpatests.push(data);
}

$scope.removeGPAScore(index){
    ctrl.gpatests=newDataList;
    ctrl.gpatests.splice( index, 1 );
}

脚本出了什么问题。?

3 个答案:

答案 0 :(得分:1)

由于您splice在同一个数组上,因此您需要将$index本身而不是gpa[$index].id传递给removeGPAScore函数。像这样,

<span ng-click="removeGPAScore($index)"> x </span>

答案 1 :(得分:0)

为什么是ng-click="removeGPAScore(gpa[$index].id)">

提及:ng-click="removeGPAScore(gpa[$index])">

答案 2 :(得分:0)

ng-model="gpa.date"替换为使用 $scope.removeGPAScore(index){ ctrl.gpatests=newDataList; ctrl.gpatests.splice( index, 1 ); }

然后使用

{{1}}