Angular DataTable not populating DTInstance

问题

I am not getting my DtInstance populated after rendering. Anyone faced this issue.

<div ng-controller="InventoryTableController as vm">
          <table datatable="" dt-options="vm.dtOptions" dt-columns="vm.dtColumns"
                 dt-instance="vm.dtInstance"
                 class="display table table-bordered table-striped table-hover"></table>
      </div>

回答1:

I was able to fix it by this https://github.com/l-lin/angular-datatables/issues/365

The problem was due to I initialized the dataHolder like this

vm.dtInstance = {};

It fixed when I changed it into vm.dtInstance = null; even vm.dtInstance = undefined wont work.

回答2:

For me even vm.dtInstance = null; did not work. I ended up going throught the source of the directive and found that dt-instance can also be a setter function. That solved the problem for me.

vm.setDTInstance = function(dtInst){
    vm.myTable = dtInst;
};

回答3:

Just adding my 2 cents here.

For me the problem was solved by @rosshays solution in the thread: https://github.com/l-lin/angular-datatables/issues/345

Update Dec. 4 2017: As per @trainoasis suggestion, i am copying the solution to here.

In your controller

$scope.nested = {};
$scope.nested.dtInstance = {}

And in your HTML

<table
    datatable=""
    class="table table-striped table-hover table-bordered table-condensed"
    dt-options="dtOptions"
    dt-columns=dtColumns
    dt-instance="nested.dtInstance">
</table>

回答4:

I am using

.withOption('serverSide', true).withFnServerData(getDataFromServer)

and I was having the same issue, but it was resolved with the following code:

Controller

$scope.dtInstance = {};
$scope.dtIntanceCallback = function (instance) {
    $scope.dtInstance = instance;
}
$scope.dtRebind = function () {
    $scope.dtInstance.DataTable.draw()
}

HTML

<table datatable dt-instance="dtInstanceCallback"></table>
<button ng-click="dtRebind">Rebind</button>

回答5:

Another way to trigger this is to iterate over a sequence of tables, using <... ng-repeat="table in tables"> <table datatables="ng" dt-instance="dtInstance" ... >. When there is more than one table, it is not surprising that this way, dtInstance may not refer to the table that you expected it to.

However, when you know that there is always exactly one table in the set, you might expect dtInstance to refer to that one instance. But it does not. The solution in my case was to get rid of the extra layer and simply use the one table.

来源：https://stackoverflow.com/questions/33980618/angular-datatable-not-populating-dtinstance

标签

angularjs

datatables

angular-datatables