//html部分:
<table datatable dt-options="dtOptions" dt-columns="dtColumns" dt-instance="dtInstance" ></table>
//js部分
$scope.dtInstance = {};
$scope.dtOptions = DTOptionsBuilder
.newOptions()
.withOption('ajax',{url:'/api/getdate',type:'GET'})//请求的URL及方式
.withOption('processing', true) //是否显示正在处理的状态
.withOption('serverSide', true) //是否开启服务器模式
.withOption('destroy', true) //销毁所有符合选择table,并且用新的options重新创建表格
.withDataProp('data','data') //用来显示表格的数据
.withOption('searching', false) //是否允许Datatables开启本地搜索
.withPaginationType('full_numbers')
.withOption('lengthChange', false) //是否允许用户改变表格每页显示的记录数
.withOption('sort',false)
.withOption('fnRowCallback',function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
var scope =$scope.$new() ;
scope.item = aData ;
$compile(nRow)(scope);
}) //生成的表格中DOM元素也可识别angular指令
.withBootstrap();
$scope.dtColumns = [
DTColumnBuilder.newColumn('id').withTitle('title1'),
DTColumnBuilder.newColumn('taskName').withTitle('title2'),
DTColumnBuilder.newColumn('reversion').withTitle('title3').renderWith(
function(data, type, full) {
if(data){
return data.substring(0,8) ;
}else{
return "master";
}
}
),
DTColumnBuilder.newColumn('codeUrl').withTitle('title4'),
DTColumnBuilder.newColumn('status').withTitle('title5'),
DTColumnBuilder.newColumn('createTime').withTitle('title6'),
DTColumnBuilder.newColumn('lastTime').withTitle('title7'),
DTColumnBuilder.newColumn('createdBy').withTitle('title8'),
DTColumnBuilder.newColumn('').withTitle('操作'),
] ;
//重新加载表格:会销毁原dom
$scope.dtInstance.rerender();
//更新数据
$scope.dtInstance.reloadData(null,false) ;