Datatable.net 分页按钮单击的回调函数答案

【问题标题】：Callback function for Datatable.net paging buttons clickDatatable.net 分页按钮单击的回调函数
【发布时间】：2019-04-11 20:53:17
【问题描述】：

我正在尝试点击数据表上的一个分页按钮时的点击事件，但不确定如何在 Angular 中实现这一点。

如果我查看this 示例，我将如何在Angular 中编写相同的代码，并在单击事件中，emit 通过@Output 属性发生事件，以便可以通知我的父组件是否触发了分页事件？

【问题讨论】：

您是否在 Angular 项目中使用 jquery 数据表？
是的，我是...正在考虑用 ag-grid 替换它

标签： angular typescript datatable datatables

【解决方案1】：

如果要在初始化数据表的组件中处理点击事件，则无需发出事件。只需使用您在组件中提供的示例中的代码，您的事件就可以正常工作。

Here 我已经创建了您提供的示例的角度版本。在数据表分页器上单击下一步，您将看到事件触发。

但是，如果要在初始化数据表的组件的父组件中处理事件，则需要通过@Output发出和事件并在子组件中处理。或者您可以使用任何其他可能适合您的逻辑的组件交互技术。

希望对你有帮助

【讨论】：

我还在学习 Angular，不知道我是否能够通过该示例访问数据表，我想我应该尝试过...感谢您的努力 :-)

【解决方案2】：

在尝试了上述提供的解决方案后，它并不完全适合我。

我不得不更改提供的实现，如下所示：

drawCallback: () => {
          $(document).on('click', '#datatables_next', () => {
            this.nextClicked.emit("continuation");
          });
          $(document).on('click', '#datatables_previous', () => {
            console.log('next clicked...');
          });
        }

问题是，使用提供的解决方案，我的事件从未被触发。这是因为我认为分页控件是动态加载的，而在我尝试绑定到这些控件时，它们并不存在。

【讨论】：