javascript - angularjs使用拼接函数删除选定的项目

标签 javascript html angularjs angularjs-ng-repeat

我一直在寻找从网格中删除项目的解决方案;这就是我之前发布问题的原因。但是当我从某人那里得到解决方案时,当时我认为它解决了问题,但是它使用了 Filter 方法。

但是,我希望使用拼接函数从 GRID 中删除这些项目。

这是我的旧问题链接 Angularjs, Applying Action on Selected Checkboxes in Table

我希望它使用拼接函数执行。

现在我面临的问题是将索引值传递给函数,以便在选择/获取该索引值时可以删除该项目。我不确定如何修复它。

如果有人解决了这个问题并提供了更新代码的演示链接,那就太好了。

这是我迄今为止尝试过的 Plunker 链接。 Plunker link to show my execution

最佳答案

JS array.splice方法的定义(来自MDN):

array.splice(index , howMany[, element1[, ...[, elementN]]])

因此,您的remove函数应该写成:

$scope.remove = function(index){
  $scope.students.splice(index, 1);
};

DEMO PLUNKER

编辑:

我想你想删除项目,方法是单击“x”按钮,ng-click 指向 remove 函数。

要通过单击复选框来删除项目,您应该将复选框 ngModel 设置为学生属性,而不是将 $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);

PLNUKER

关于javascript - angularjs使用拼接函数删除选定的项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17362099/

相关文章:

javascript - Firebase 数据库引用快照不返回任何数据

javascript - 如何在 Jest 自定义匹配器中打印漂亮的对象差异?

javascript - jQuery 动态背景颜色更改在包含该类的元素上强制使用 "inline"样式

javascript - 缩小 Canvas 元素然后获取 imageData

javascript - 如何获取html对象将其作为AngularJS中的变量传递

javascript - 如何确保 javascript 能够在主流浏览器上运行

javascript - 不使用 css 的动态 HTML 页面

javascript - 点击复制没有复制按钮

javascript - AngularJS 改变注入(inject)的全局变量值

javascript - @Injectable 装饰器基本上相当于 Spring 中的 @Component 或 @Autowired 的 Angular 2 吗?