JQuery DataTable Angular

Question

Я большой поклонник jquery DataTable, но я понимаю, что с помощью AngularJs он не работает, он показывает все данные с разбивкой по страницам и говорит «В таблице нет данных, отображающих 0 до 0 из 0 записей». Я вижу сайт http://l-lin.github.io/angular-datatables/, но я не могу заставить его работать, я получаю информацию из базы данных. im newbe на угловом JS. Таким образом, в основном есть человеческий способ использования jquery datatable с угловыми и успешными ?.

 Arr     = new Object(); 
     Arr['Accion']  = "ObtenerDatosPersonal"; 
     params    = JSON.stringify(Arr); 

     var url = 'modulos/personal/funciones.php'; 
     $http({ 
      method: "post", 
      url: url, 
      data: $.param({params:params}), 
      headers: { 'Content-Type': 'application/x-www-form-urlencoded' } 
     }).success(function(data, status, headers, config) { 
      $scope.Empleadosmodal = data.Empleados; 
      Cantidad    = Empleados.length; 

      $('#Empleados').DataTable(); 
      $("#myModal").modal("show");  
     })/*Success*/ 
     .error(function(data, status, headers, config) 
     { 
      alert("Ha fallado la petición. Estado HTTP:"+status); 
     }); 

Answer 1

Я не очень понимаю ваши сомнения. Но я использовал Jquery datatable с angularJs с поддержкой углового datatable. Вам нужно добавить следующую ссылку на странице в том же порядке,

<script src="jquery.min.js"></script> 
<script src="jquery.dataTables.min.js"></script> 
<script src="angular.min.js"></script> 
<script src="angular-datatables.min.js"></script> 

Используйте тег таблицы, как,

 <table id="example" datatable="ng" dt-options="dtOptions" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%"> 

Затем добавьте услугу DTOptionsBuilder к контроллеру.

app.controller('userController',ListCtrl); 
ListCtrl.$inject['$scope', 'DTOptionsBuilder', 'DTColumnBuilder']; 
function ListCtrl($scope, DTOptionsBuilder, DTColumnBuilder) { 

............... 
} 

Добавьте следующее в функции контроллера

$scope.dtOptions = DTOptionsBuilder.newOptions() 
.withOption('responsive', true) 
.withOption('bAutoWidth', false) 
.withPaginationType('full_numbers') 
.withDOM('frtip'); 

Вот и все. Это сработало для меня. Обратите внимание, что

element.DataTable() 

Не нужно звонить при использовании угловых данных.