2016-04-12 7 views
0

Я работаю с угловыми DataTables, и я должен состояний: #/app/configurations/formations и #/app/configurations/filieres, поэтому при переключении между этими двумя состояниями у меня есть некоторые вопросы, связанные с презентацией следующим образом:angularjs DataTables не реагируют

первый время, когда я достигаю #/app/configurations/formations это то, как он выглядит:

enter image description here

, но когда я доступ к некоторому другому состоянию, например: #/app/configurations/filieres моего DataTable не расширяется во всей странице:

enter image description here

и такое поведение остается для всех моих DataTables в моем приложении, поэтому я всегда, чтобы обновить страницу, чтобы сделать DataTable расширить во всей странице.

это, как я построить все мои DataTables:

var vm = this; 

    vm.dtOptions = DTOptionsBuilder.fromSource("http://localhost:8080/diplomes") 
     .withPaginationType('full_numbers') 
     .withBootstrap() 
     // Active Responsive plugin 
     .withOption('responsive', false) 
     .withOption('initComplete', function(settings) { 
     // Recompiling so we can bind Angular directive to the DT 
     $compile(angular.element('#' + settings.sTableId).contents())($scope); 
     }); 
    vm.dtColumns = [ 
     DTColumnBuilder.newColumn('codeDiplome').withTitle('ID Diplome'), 
     DTColumnBuilder.newColumn('nom').withTitle('NOM Diplome'), 
     DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable() 
     .renderWith(function(data, type, full, meta) { 
      if (true) { 
       return '<button class="btn btn-bl btn-success btn-ef btn-ef-5 btn-ef-5b mb-10" ng-click="openEditModal('+data.codeDiplome+')"><i class="fa fa-edit"></i> <span>'+$scope.update+'</span></button>&nbsp;' 
       + '<button class="btn btn-danger btn-ef btn-ef-5 btn-ef-5b mb-10" ng-click="openDeleteModal('+data.codeDiplome+')"><i class="fa fa-trash"></i> <span>'+$scope.delete+'</span></button>'; 
      } else { 
      return ''; 
      } 

     }) 
    ]; 

ответ

0

Решение было добавить специальный класс к DataTable, например dt-responsive, а затем зададим стиль для этого класса width: 100%!important

Смежные вопросы