DTColumnDefBuilder

This service will help you build your datatables column defs. All it's doing is appending to the DataTables options the object aoColumnDefs

Writing the following code:

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTOptionsBuilder, DTColumnDefBuilder) { var vm = this; vm.dtOptions = DTOptionsBuilder.newOptions(); vm.DTColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).notSortable() ]; }

is the same as writing the following:

vm.options = { aoColumnDefs: [ { aTargets: 0, bSortable: false } ] };

Note: Of course, this helper is not mandatory. This helper only constructs a JSON object. You can directly pass the datatable column options on the element attributes and dt-column-defs.

 The column defs must be provided in the dt-column-defs directive whereas the column options must be provided in the dt-columns" directive.


Helper/Wrapper API Description
DTColumnDefBuilder newColumnDef(aTargets)

Create a new wrapped DTColumnDef. It posseses the same function as DTColumn.

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; vm.dtColumnDefs = [ DTColumnDefBuilder.newColumnDef(0) ]; }
DTColumnDef withOption(key, value) Add the option of the column. For example, the following code add the option sContentPadding:
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; vm.dtColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).withOption('sContentPadding', 'mmm') ]; }
DTColumnDef withTitle(title)

Set the title of the colum.

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; vm.dtColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).withTitle('FooTitle') ]; }
DTColumnDef withClass(sClass)

Set the CSS class of the column

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; vm.dtColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).withClass('foo-class') ]; }
DTColumnDef notVisible()

Hide the column.

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; vm.dtColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).notVisible() ]; }
DTColumnDef notSortable()

Set the column as not sortable

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; vm.dtColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).notSortable() ]; }
DTColumnDef renderWith(mrender) Render each cell with the given parameter
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl); function MyCtrl(DTColumnDefBuilder) { var vm = this; // Data fetched: {gender: 'Mr', firstName: 'foo', lastName: 'bar'} vm.DTColumnDefs = [ DTColumnDefBuilder.newColumnDef(0).renderWith(function(data, type, full) { return full.gender + ' ' + full.firstName; }); ]; }