angular-datatable列可拖出表格

是否有可能避免列,而不是拖出数据表视图区域,因为你可以自己弄清楚,我正在通过这个链接谈论https://l-lin.github.io/angular-datatables /#/ withColReorder

在此处输入图像描述 当您尝试将列拖远到数据表时。 我在官方组件网站上提出了这个问题https://github.com/l-lin/angular-datatables/issues/496

(以防万一提出问题,更好地解释我在谈论的内容)

正如l-lin所指出的,angular-datatables是jQuery dataTables的包装器,提供指令并确保dataTable不与angular冲突。 要更改核心function,您仍必须更改核心。

您可以通过猴子修补来更改dataTables核心库中的许多内容。 要防止在表的

部分之外拖动列标题,您可以执行以下操作:

 var old_fnMouseMove = $.fn.DataTable.ColReorder.prototype._fnMouseMove; $.fn.DataTable.ColReorder.prototype._fnMouseMove = function(e) { var x = e.clientX, y = e.clientY, r = document.querySelector('#example thead').getBoundingClientRect(), within = (x>r.left && xr.top && y 

以上覆盖ColReorders mousemove事件正在进行拖动时。 如果鼠标位于

元素之外,它只是不将事件传递给原始函数 - 通过有效地阻止向外拖动列。

angular-datatables演示 - > http://plnkr.co/edit/uPv8FoUrJkQWnEaE2AQY?p=preview

纯jQuery dataTables演示 - > http://jsfiddle.net/0boznoh7/