我试图在角度数据表中实现我的自定义加载.我检查了文档：
https://l-lin.github.io/angular-datatables/#/overrideLoadingTpl,建议实现：
angular.module('showcase',['datatables']).
factory('DTLoadingTemplate',dtLoadingTemplate);
function dtLoadingTemplate() {
return {
html: '<img src="images/loading.gif">'
};
}
因此,在我的自定义选项中,我在选项sLoadingRecords和sProcessing中注入加载,但不起作用.
.factory('myDTOptions',function (DTOptionsBuilder,DTLoadingTemplate) {
return {
option1: function(){
return DTOptionsBuilder.newOptions()
.withPaginationType('full_numbers')
.withDisplayLength(10)
.withBootstrap()
.withOption('responsive',true)
.withLanguage({
"sEmptyTable": "No hay información disponible","sInfo": "Mostrando _START_ a _END_ de _TOTAL_ entradas","sInfoEmpty": "Mostrando 0 a 0 de 0 entradas","sInfoFiltered": "(filtrada de _MAX_ entradas totales)","sInfoPostFix": "","sInfoThousands": ",","sLengthMenu": "Mostrando _MENU_ entradas","sLoadingRecords": DTLoadingTemplate,"sProcessing": DTLoadingTemplate,"sSearch": "Buscar: ","sZeroRecords": "No se encuentra coincidencias en la búsqueda","oPaginate": {
//Dos opciones: https://github.com/DataTables/Plugins/issues/62
"sFirst": '<i class="fa fa-angle-double-left"></i>',"sLast": '<i class="fa fa-angle-double-right"></i>',"sNext": '<i class="fa fa-angle-right"></i>',"sPrevIoUs": '<i class="fa fa-angle-left"></i>'
},"oAria": {
"sSortAscending": ": activar para ordenar columna ascendentemente","sSortDescending": ": activar para ordenar columna descendentemente"
}
})
/*
.withColVis()
.withColVisOption('aiExclude',[0,1,6,7,8])*/
}
解决方法
我有同样的问题;在调查来源后,事实证明这很简单. datatables.options应该作为依赖注入,与所有其他dataTables功能完全一样：
angular.module('myModule',[
'datatables','datatables.buttons','datatables.bootstrap','datatables.fixedheader',...
'datatables.options',//<---
])
然后还应包含DTDefaultOptions服务(示例)：
.controller('myCtrl',['$scope','DTOptionsBuilder','DTDefaultOptions',function ($scope,DTOptionsBuilder,DTDefaultOptions) {
现在默认< h3>正在加载…< / h3>模板可以通过(示例)更改：
DTDefaultOptions.setLoadingTemplate('<em>Fetching data</em> ...')
Loading …元素与dataTables语言设置无关,但是angular dataTables拥有初始化消息. BTW这个元素可以通过CSS类.dt-loading来设置样式：
.dt-loading {
color: red;
}
