这篇文章记录一些datatables常用的回调函数
rowCallback：表格行绘制的回调函数
rowCallback: (row, data, index) => {}参数row表示这一行的dom，data表示这一行的全部数据，index表示这一行的内部索引。另外还有一个相似的回调函数createdRow，参数也是一样的，官网上说createdRow的效率高于rowCallback，实践中也没有比较过，不过createdRow会先于rowCallback触发。
initComplete：表格初始化结束后的回调函数。有两个参数，一个是setting，datatables的设置对象；一个是json，如果使用ajax选项来获取数据，则得到服务器返回的数据，否则是 undefined
一般常用的回调函数就这几个，很少，还有很多跟保存表格状态有关的回调函数，大家可以直接去datatables官网查询，虽然是jquery版本的，但是原理都是一样的。
在angular中还有一点是需要注意的，那就是angular对于dom只渲染一次，如果之后改变了dom的结构，比如添加了新的click事件，那么angular将不会作出反应，例如在columns.render中设置：
render: (data, type, row, meta) => { return '<div><button (click)="test()">通过</button>' }这样即使在组件中定义了test这个函数，点击按钮也不会触发。在angularjs中可以使用$compile服务来对dom重新编译以解决这个问题，但是在angular5中我没有找到类似的用法，好像并不提倡这种写法。目前我是使用rowCallback+jquery的方法来解决这个问题。例如：
render: (data, type, row, meta) => { if (row.state == 0) { return '<div>' + '<button class="agreeBtn btn btn-sm btn-raised btn-blue">通过</button>' + '<button class="refuseBtn btn btn-sm btn-raised btn-red">拒绝</button>' + '</div>'; } else { return '未通过审核' } } rowCallback: (row, data, index) => {//每一行创建完成之后的回调函数 let self = this; self.dtElement.dtInstance.then((dtInstance: DataTables.Api) => {//用于获取datatable的实例 //对审核通过和拒绝button绑定相应的事件 if ($('.agreeBtn', row).length > 0) { $('.agreeBtn', row).unbind('click'); $('.agreeBtn', row).bind('click', () => { self.systemService.updateUserState(data.id, 1).subscribe(result => { if (result) { alertFunctions.basicSuccess('成功', '用户' + data.name + '审核通过'); dtInstance.row(row).remove(); dtInstance.draw(); self.ifAudited = true; } else { alertFunctions.basicError('失败', '用户' + data.name + '审核失败'); } }) }) $('.refuseBtn', row).unbind('click'); $('.refuseBtn', row).bind('click', () => { self.systemService.updateUserState(data.id, -1).subscribe(result => { if (result) { $('.auditTd', row).html('未通过审核'); data.state = -1; dtInstance.draw() } else { alertFunctions.basicError('失败', '拒绝通过审核失败'); } }) }) } }) )代码里面的dtElement是通过
@ViewChild(DataTableDirective) dtElement: DataTableDirective;得到的，通过 self.dtElement.dtInstance.then((dtInstance: DataTables.Api)=>{})就可以获得datatables的实例。
下面再记录一下ajax这个属性：
ajax用于异步获取数据填充到表格中。数据源可以是两种类型：对象数组和纯数组。当你使用对象数组作为数据源时，你需要使用 columns.data来匹对对象的属性，例如：
{ "data": [ { "name": "Tiger Nixon", "position": "System Architect", "salary": "$3,120", "start_date": "2011/04/25", "office": "Edinburgh", "extn": "5421" }, // row 2 data source, // etc ] }那么就需要做如下设置：
"columns": [ {"data": "name"}, {"data": "position"}, {"data": "salary"}, {"data": "start_date"}, {"data": "office"}, {"data": "extn"} ]如果使用的是纯数组则不需要使用，DataTables 会默认按照数组的顺序显示每一个行数据。还有一点需要注意的是，datatables默认接受一个属性为data的数据，如果你返回的数据不是这样，你需要使用 ajax.dataSrc来处理，我们稍后再来说这个属性。
ajax接受3种类型的参数：
string - 设置获取数据的urlobject - 和 jQuery.ajax 定义类似function- 自定义获取数据的功能当参数是object时，记录一下与jquery.ajax不一样的地方。
在datatables中，ajax.data可以是object，也可以是function。当为object时与jquery.ajax一样，当为function时，函数有一个参数data，官网对这个参数的解释为：Datatables构造的请求参数，如果开启了服务器模式( serverSide:true) 这个还会包含服务器请求的一些参数，具体到底是什么目前我也不是很清楚，以后搞清楚了会第一时间更新。当函数没有返回值时，这个data参数就会作为request发送的数据；如果返回一个对象，那么这个对象就会作为request发送的数据；如果返回一个字符串，一般是用JSON.stringify()来获取，服务端可以直接解译。
datatables的ajax有一个新的属性叫dataSrc，它可以改变从服务器端返回的数据给datatables，或者是操作数据从一种形式转换成另一种形式，添加这个参数的目的是因为success函数在datatables的ajax中是不能重写的，它是自动调用的。dataSrc可以是string也可以是function。
当为string时，之前我们说过，datatables默认接受的是一个属性为data的数据（对象数组或者纯数组），dataSrc就可以改变这个属性名字，例如设置"dataSrc": "tableData"，那么datatables就会去寻找属性为"tableData"的数据，如果设置"dataSrc": ""，datatables就会从数组里获取数据（比如： { [ ...data... ] } ）。
当为function时，dataSrc 可以操作从服务器返回的数据转化成另一种。 例如， 如果数据被分隔在多个数组里面，你需要合并到一个数组返回给Datatables处理后显示非json格式的数据，可以通过 dataSrc来转换成javascript数组交给Datatables显示 ，接受一个data参数，返回一个datatables使用的数据数组。
ajax还可以接受一个function参数，function ajax( data, callback, settings )。作为一个函数，这个可以完全自己控制Ajax请求，请求参数，返回的数据都可以不受 DataTables 的影响。事实上你可以使用非Ajax请求，而直接使用本地储存。你可以直接从本地数据库获取数据交给 callback 去处理。参数data是发送给服务器的数据，callback是回调函数，必须被执行，DataTables才能获取到数据，且将返回的数据作为callback()的唯一参数。例如：
"ajax": function (data, callback, settings) { callback( JSON.parse( localStorage.getItem('dataTablesData') ) ); }