2015-07-20 4 views
2

У меня есть контроллер, и я хочу, чтобы вызвать уничтожить функцию Jquery DataTables в контроллере в вахтовым методом:Как вызвать функцию разрушения угловых данных?

 $scope.$watch('model.SelectedWaiver', function() { 
     if ($scope.model.SelectedWaiver.SurchargeID != null) { 
      //destroy table here 
      $scope.getIndecies($scope.model.SelectedWaiver); 

     } 
    }); 

Я не создание таблицы в любом случае в настоящее время, потому что есть две таблицы на страница:

первый:

<table datatable="ng" dt-options="dtOptions" dt-columns="dtColumns" class="table-bordered"> 
    //stuff 
</table> 

второй:

<table datatable="ng" id="secondTable" dt-options="dtOptions" dt-columns="dtColumns" class="table-bordered"> 
    //stuff 
</table> 

Я хочу уничтожить эту таблицу, когда пользователь выбирает другую строку в первой таблице.

JQuery эквивалент:

<script> 
    $(document).ready(function() { 
     var table = $('#secondTable').DataTable(); 


    }); 
    $('#selectedWaiver').on('change', function() { 
     table.destroy(); 
    }); 
</script> 

Как сделать эту часть кода в угловой?

Using this to inject datatables

ответ

4

С dtInstance у вас есть доступ к DataTables API:

$scope.dtInstance = {}; 

добавить dtInstance как объявление в таблице

<table datatable dt-instance="dtInstance" dt-options="dtOptions" dt-columns="dtColumns"> 

Теперь вы можете уничтожить DataTable с

$scope.dtInstance.DataTable.destroy(); 

угловые DataTables имеют расширенный ngDestroy() очистки привязок, сделанные себе:

$scope.dtInstance.DataTable.ngDestroy(); 

Существует еще некоторые style (и немного больше мусора слева) в заголовках, так что удалить их тоже (здесь на столе с идентификатором #table):

$scope.destroy = function() { 
    $scope.dtInstance.DataTable.ngDestroy(); 
    var i, ths = document.querySelectorAll('#table th'); 
     for (i=0;i<ths.length;i++) { 
      ths[i].removeAttribute('style'); 
     } 
    } 
} 

демо ->http://plnkr.co/edit/fQ9YjsbNBNzyYuuvpk6T?p=preview

Если у вас несколько угловых данных, используйте несколько dtInstances и другую таблицу id's.

+0

Таблица не уничтожает в вашем plunker –

+0

@NullPointer это для вас? – query

+0

Нет, это не сработало для меня. –

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