【问题标题】:Angular Datatables - Refresh Table [duplicate]Angular Datatables - 刷新表 [重复]
【发布时间】:2019-11-07 06:00:46
【问题描述】:

我在我的 Angular 应用程序中使用 angular-datatables。当数据更改时(例如,填写并提交表单时),我需要刷新数据表。等效的 jQuery 代码是

$('#my-datatable').DataTable.ajax.reload()

我正在使用 Angular 7。这是我正在使用的库的 link

【问题讨论】:

  • 我强烈建议您不要使用该库。它使用 jquery,并且在 Angular 应用程序中使用 jquery 并不是很好的做法。有很多提供表格功能的库
  • @devpato,请在上面的评论中将我引导到您正在谈论的库
  • @devpato,在您提供的类似 stackoverflow 答案上,似乎它正在使用 jQuery,我可以简单地执行 $('#my-datatable').DataTable.ajax.reload() 并且它正在工作。

标签: angular datatables angular-datatables


【解决方案1】:

dtInstance.ajax.reload()。您可以创建一个 reload() 函数。

试试这样:

import { DataTableDirective } from 'angular-datatables';

dtElement: DataTableDirective;
dtInstance: Promise<DataTables.Api>;

reload() {
  this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => {
    dtInstance.ajax.reload()
  });
}

【讨论】:

  • 它如何识别特定的数据表?假设我在同一页面中有多个数据表
  • 你需要使用@ViewChildren(DataTableDirective); dtElements: QueryList&lt;DataTableDirective&gt;
  • And this.dtElements.forEach((dtElement: DataTableDirective) => { // 获取实例并做你的事情 });
  • 如果你提供了一个stackbiltz,可以显示工作演示,因为我没有在评论中尝试上面的代码。在我的一个项目中,我为 3 个表创建了 3 个子组件以避免这种情况
猜你喜欢
  • 1970-01-01
  • 2014-10-06
  • 2017-12-24
  • 1970-01-01
  • 2019-02-21
  • 1970-01-01
  • 1970-01-01
  • 2021-10-01
  • 1970-01-01
相关资源
最近更新 更多