Angularjs在剑道网格上绑定自定义剑道事件的标准方法答案

【问题标题】：Angularjs standard way to bind custom kendo events on kendo gridAngularjs在剑道网格上绑定自定义剑道事件的标准方法
【发布时间】：2026-02-20 20:45:01
【问题描述】：

我想知道是否有绑定剑道自定义事件的 angularjs 最佳实践。

我有一个带有列菜单的网格，可让您隐藏或显示列。

只要您选中/取消选中隐藏/显示列，就会触发剑道 columnHide 或 columnShow 事件。

在我的指令中，我有以下代码来捕获该事件。我想知道这是否是绑定这些事件的最佳方式以及是否存在任何潜在的内存问题（例如是否有必要取消绑定这些事件）：

angular.module('sgComponents').directive('sgGrid', [

   link: function (scope, elm, attrs, ctrls) {

      kendoGrid = elm.data('kendoGrid'); // the grid

      kendoGrid.bind('columnHide', function () { 
         console.log('HIDE COLUMN');
      });

      kendoGrid.bind('columnShow', function () {
         console.log('SHOW COLUMN');
      });
   }
]);

【问题讨论】：

标签： javascript angularjs dom-events kendo-grid angular-kendo

【解决方案1】：

假设删除网格时 kendo 网格代码会删除您的侦听器，您应该没问题。如果剑道网格没有自行清理，您可以执行以下操作：

scope.$on('$destroy', function() {
  kendoGrid.destroyOrWhateverItsCalled();
});

当你的指令从视图中移除时，Angular 会触发 $destroy 事件。

【讨论】：

似乎他们有一个你应该调用的destroy()方法：docs.telerik.com/kendo-ui/api/web/grid#methods-destroy
感谢我团队中的另一位开发人员已经在指令中实现了这一点，所以看起来我已经被覆盖了！

【解决方案2】：

从我在此处和其他网站上所做的（诚然不多！）研究来看，似乎没有标准的、推荐的 angularjs 方法来绑定自定义剑道事件（以及一般的自定义事件）。我在上面的问题中使用 jQuery 的 bind() 完成的方式是 * 上的其他人已经完成的方式，所以我坚持这样做。

作为参考，这里已经提出了类似的问题：

Event Bindings The AngularJS Way? （'我认为目前没有 AngularJS 方法来进行这种事件绑定。据我所知，为所有缺失的事件添加本地支持正在进行中，但它还没有在任何稳定版本中发布。 ') [通过缺少事件，他指的是尚未自定义指令的事件，例如ng-click，ng-blur]

Bind events on AngularJS element directives using jQuery

AngularJS: How to listen to DOM Events?

This dude 也有一些信息，但他使用 jQuery on() 而不是 bind()，本质上是一样的，但 on() 更多最新的（见 - Best practice using BIND or ON functions in jQuery）： element.on("myEvent",...)

顺便说一句，要创建您自己定义并发出（或广播）然后使用回调处理的自定义事件，您可以使用 $on()。有关示例，请参阅此 excellent article。

【讨论】：