DTColumnBuilder
This service will help you build your datatables column options. All it's doing is appending to the DataTables options the object aoColumns
For instance, the following:
is the same as writing:
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-columns
.
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 |
---|---|---|
DTColumnBuilder |
newColumn(mData, label) |
Create a new wrapped
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function MyCtrl(DTColumnBuilder) {
var vm = this;
vm.dtColumns = [
DTColumnBuilder.newColumn('foo', 'Foo')
];
}
|
DTColumn |
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(DTColumnBuilder) {
var vm = this;
vm.dtColumns = [
DTColumnBuilder.newColumn('foo').withOption('sContentPadding', 'mmm')
];
}
|
DTColumn |
withTitle(title) |
Set the title of the colum.
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function MyCtrl(DTColumnBuilder) {
var vm = this;
vm.dtColumns = [
DTColumnBuilder.newColumn('foo').withTitle('FooTitle')
];
}
|
DTColumn |
withClass(sClass) |
Set the CSS class of the column
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function MyCtrl(DTColumnBuilder) {
var vm = this;
vm.dtColumns = [
DTColumnBuilder.newColumn('foo').withClass('foo-class')
];
}
|
DTColumn |
notVisible() |
Hide the column.
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function MyCtrl(DTColumnBuilder) {
var vm = this;
vm.dtColumns = [
DTColumnBuilder.newColumn('foo').notVisible()
];
}
|
DTColumn |
notSortable() |
Set the column as not sortable
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function MyCtrl($scope, DTColumnBuilder) {
var vm = this;
vm.dtColumns = [
DTColumnBuilder.newColumn('foo').notSortable()
];
}
|
DTColumn |
renderWith(mrender) |
Render each cell with the given parameter
angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function($scope, DTColumnBuilder) {
var vm = this;
// Data fetched: {gender: 'Mr', firstName: 'foo', lastName: 'bar'}
vm.dtColumns = [
DTColumnBuilder.newColumn('firstName').withLabel('First name').renderWith(function(data, type, full) {
return full.gender + ' ' + full.firstName;
});
];
}
|