Angular DataTable 未填充 DTInstance

Posted 2023-05-07

【中文标题】Angular DataTable 未填充 DTInstance

【英文标题】：Angular DataTable not populating DTInstance

【发布时间】：2016-03-03 00:39:20

【问题描述】：

渲染后我没有填充我的 DtInstance。任何人都遇到过这个问题。

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

【问题讨论】：

你的控制器是什么样子的？

感谢 Alger 调查此问题，我能够通过 vm.dtInstance = null; 修复它

【参考方案1】：

我可以通过 https://github.com/l-lin/angular-datatables/issues/365 修复它

问题是因为我这样初始化了dataHolder

vm.dtInstance = ;

当我将其更改为 vm.dtInstance = null; 时它已修复 甚至vm.dtInstance = undefined 也行不通。

【讨论】：

记得接受您自己的答案，以便未来的访问者可以看到这是一个可靠的解决方案。

【参考方案2】：

只需在此处添加我的 2 美分。

对我来说，问题已通过线程中的@rosshays 解决方案解决：https://github.com/l-lin/angular-datatables/issues/345

2017 年 12 月 4 日更新： 根据@trainoasis 的建议，我将解决方案复制到此处。

在你的控制器中

$scope.nested = ;
$scope.nested.dtInstance = 

在你的 html 中

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

【讨论】：

当没有其他答案时，这对我也有用。我建议您在链接旁边的答案中添加一些有关如何实现此目的的信息，因为它不需要太多...如果链接失效会更有帮助..

【参考方案3】：

对我来说甚至 vm.dtInstance = null;不工作。 我最终浏览了指令的来源，发现 dt-instance 也可以是一个 setter 函数。这为我解决了问题。

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

【讨论】：

你添加了 dt-instance="vm.setDTInstance" 还是什么？就这样？在这样做之前，您的 dtInstance 是未定义的？在您的情况下，myTable 是什么？我正在使用 Angular 数据表，所以我根本没有定义表...

【参考方案4】：

我正在使用

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

我也遇到了同样的问题，但是用下面的代码解决了：

控制器

$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】：

另一种触发方式是使用<... ng-repeat="table in tables"> <table datatables="ng" dt-instance="dtInstance" ... > 遍历一系列表。当有多个表时，这样dtInstance 可能不会引用您期望的表，这并不奇怪。

但是，当您知道集合中始终只有一个表时，您可能希望 dtInstance 引用该实例。但事实并非如此。在我的情况下，解决方案是去掉额外的层并简单地使用一个表。