【Angular】--删除表中数据

前言

   最近一直在忙Angular的图书馆项目，在软考和这个图书馆项目之间，一直在来回切换，终于体会到了忙碌是什么感觉。也终于体会到了米老师所说的时间管理的重要性是什么概念。好了，现在回归的主题了，看看小编这次的分享吧。

叙述

   在做此项目的过程中，用到了表格，此表格是一个同事封装好的一个组件，表格上面封装好了几个按钮，每一个按钮都有相应的功能。今天咱们来看一下删除这个功能吧。

   因为删除类型有两种，一种是批量删除，一种是删除一行数据，小编把这两个功能写成一个方法了。

1、在html中要有事件绑定，和表格中的按钮联系起来，具体代码如下：

<div class="container">    <div class="row">          <data-table              (deletesEmit)="deleteDatas($event)"               [deleteButton]="btnDelete" >      </data-table>    </div></div>

2、在component.ts中写上JS方法，如下

deleteDatas(el: any) {   //页面获取到的数据    let r = confirm("您确认要删除这条信息吗？");    if (r == true) {      let obj = [];       el.forEach(el => {        obj.push(this.data[el].id)   //前端页面选中的多条数据封装到一个数据中      });             let url = "basicInfo-web/student/deleteStudentByIds";      let body = JSON.stringify(obj);   //数据数组转成字符串格式      this.http.put(url, body).subscribe(    //在此处删除方法用的是put,根据后端的方法而定。        res => {          if (res.json().code = "0000") {            alert(res.json().message);            this.getData();            let i = 0;            el.forEach(el => {     //页面删除的数据从表格中去掉              this.data.splice(el - i, 1);              i++;              this.total--;            });          }        }      );    }  }

小结

   不管是什么语言，不管是什么技术，不管是什么架构，其实方法的核心内容都是一样的，核心含义也都是一样的，代码之中皆是套路。学会抽象，学会总结。加油吧，骚年！