Jquery ui 可调整大小为 Angular 指令答案

【问题标题】：Jquery ui resizable as Angular DirectiveJquery ui 可调整大小为 Angular 指令
【发布时间】：2015-11-01 14:45:59
【问题描述】：

我正在尝试将 Jquery ui 可调整大小插件实现为 Angular 指令。这几乎是成功的。但是，当我为可调整大小的插件显式设置处理程序时，每当我单击任何 dom 项时都会出现错误。

Uncaught TypeError: Cannot read property 'ownerDocument' of undefined

这里是角度指令；

App.directive('resizable', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            $(element).resizable({
                handles: { 's' : '.handle' }
            });
        }
    };
});

HTML;

<div class="row list-box" resizable>
<div class="handle ui-resizable-handle ui-resizable-n fa fa-ellipsis-h"></div>

另外，将 jquery ui 与 angularjs 一起使用的最佳做法是什么？

谢谢。

【问题讨论】：

标签： javascript jquery angularjs jquery-ui

【解决方案1】：

我找到了解决方案。问题是处理程序div 没有放在resizable div 中。正确放置后，它按预期工作。

<div class="row list-box" resizable>
    ...
    <div class="handle ui-resizable-handle ui-resizable-n fa fa-ellipsis-h"></div>
</div>

【讨论】：