Html angularjs 使用 splice 函数删除选定的项目
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17362099/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
angularjs remove Selected Items using splice Function
提问by Sizzling Code
I was looking for a solution to remove items from the Grid; that's why I posted the question before. But when I got the solution from someone, at that time, I thought it solved the issue, but it was using a Filter method.
我正在寻找从网格中删除项目的解决方案;这就是我之前发布问题的原因。但是当我得到某人的解决方案时,当时我认为它解决了问题,但它使用了Filter方法。
However, I want the items to be removed from the GRID using a Splice Function.
但是,我希望使用 Splice 函数从 GRID 中删除项目。
Here is my old Question Link Angularjs, Applying Action on Selected Checkboxes in Table
这是我的旧问题链接 Angularjs,对表中选定的复选框应用操作
I want it to execute using a Splice Function.
我希望它使用 Splice 函数执行。
Right now the problem I am facing is to pass the index value to the function so that the item can be deleted if that index value is selected/fetched. I am not sure how to fix it.
现在我面临的问题是将索引值传递给函数,以便在选择/获取该索引值时可以删除该项目。我不知道如何解决它。
It would be nice if someone solves the problem and gives a demo link to the updated code.
如果有人解决问题并提供更新代码的演示链接,那就太好了。
Here is the Plunker Link for what I have tried so far.Plunker link to show my execution
这是我迄今为止尝试过的 Plunker 链接。Plunker 链接显示我的执行
回答by Stewie
Definition of JS array.splice method (from MDN):
JS array.splice 方法的定义(来自MDN):
array.splice(index , howMany[, element1[, ...[, elementN]]])
array.splice(index , howMany[, element1[, ...[, elementN]]])
So, your remove
function should be written as:
所以,你的remove
函数应该写成:
$scope.remove = function(index){
$scope.students.splice(index, 1);
};
EDIT:
编辑:
I figured you wanted to remove the items by clicking the "x" button with ng-click pointing to remove
function.
我想你想通过单击“x”按钮来删除这些项目,并用 ng-click 指向remove
函数。
To remove the items by clicking the checkbox you should set checkbox ngModel to a student property and than put a $watcher on students that would remove those students who have this property set to true:
要通过单击复选框删除项目,您应该将复选框 ngModel 设置为 student 属性,然后在学生上放置 $watcher 以删除那些将此属性设置为 true 的学生:
<tr class="color2" ng-repeat="student in students | filter:search | filter:new_search">
<td>{{student.Rollno}} <input type="checkbox" ng-model="student.checked"> </td>
<td>{{student.Name}}</td>
<td>{{student.Uni}} <button ng-click="remove($index)">x </button></td>
</tr>
$scope.$watch('students', function(students){
if(!students){
return;
}
$scope.students = students.filter(function(student){
return !student.checked;
});
}, true);
回答by Ajay Beniwal
I have added ng-click to checkbox to make it working
我已将 ng-click 添加到复选框以使其正常工作