如何调用angular个数据表的销毁函数？

Question

我有一个controller，我想在watch方法中调用controller中JqueryDatatables的销毁函数：

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

        }
    });

我目前没有以任何方式设置 table，因为页面上有两个 table：

第一个：

<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>

我想在用户在第一个 table 中选择不同的行时销毁此 table。

jquery相当于：

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


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

如何执行 angular 中的这部分代码？

Using this to inject datatables

Answer 1

使用 dtInstance 您可以访问数据表 API :

$scope.dtInstance = {};

添加 dtInstance 作为对 table

的声明

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

现在您可以使用

销毁数据表

$scope.dtInstance.DataTable.destroy();

angular dataTables 有一个扩展的 ngDestroy() 清除自己创建的绑定：

$scope.dtInstance.DataTable.ngDestroy();

headers 中还有一些 style（还有一些垃圾），所以也将它们删除（这里是 table，id 为 [=19] =]) :

$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

如果您有多个 angular 数据表，请使用多个 dtInstances 和不同的 table id's.

如何调用angular个数据表的销毁函数？

How to call the destroy function of angular datatables?

angularjs

angular-datatables