jQuery 不适用于 AngularJS 指令答案

【问题标题】：jQuery doesn' t work for AngularJS directivejQuery 不适用于 AngularJS 指令
【发布时间】：2016-10-15 02:16:30
【问题描述】：

我必须调整位于指令内的表格的列宽。我找到了一个有效的框架来做到这一点： Resizable table columns with jQuery。但是，我有以下问题。调整大小列的工作非常简单，只需在我的 Angular 控制器中添加这个 jQuery 代码：

$("#normal").colResizable({
                liveDrag:true, 
                gripInnerHtml:"<div class='grip'></div>", 
                draggingClass:"dragging", 
                resizeMode:'fit'
            });

其中normal是我的表的ID，如下：

<table id="normal" width="100%" border="0" cellpadding="0" cellspacing="0">
            <tr>
                <th>header</th><th>header</th><th>header</th>
            </tr>
            <tr>
                <td class="left">cell</td><td>cell</td><td class="right">cell</td>
            </tr>
            <tr>
                <td class="left">cell</td><td>cell</td><td class="right">cell</td>
            </tr>
            <tr>
                <td class="left bottom">cell</td><td class="bottom">cell</td><td class="bottom right">cell</td>
            </tr>                                                                   
        </table>

现在的问题是 jQuery 不适用于指令中的表格，我的意思是，如果我将表格放在普通的 html 页面中，它可以调整列宽的大小，但是如果我将表格代码放在 AngularJs 中指令它不起作用。

我的页面中只有表格，没有其他代码可以影响它的功能。

我猜问题出在 jQuery 上，但我并不完全确定。我是 Angular 的新手，也许我应该在指令中配置一些东西？

【问题讨论】：

你的意思是它不能使用一些自定义指令？
@ NightsWatch 是的，没错，我刚刚找到了解决方案，我必须在指令而不是控制器中添加 jquery 代码。
酷！我正在考虑通过在您的自定义指令中提供 replace : true 属性可能会产生魔力。如果可能的话，请您尝试一下并分享您的反馈。它可能对其他人有帮助。
@NightsWatch 实际上已经将 replace 属性设置为 true

标签： jquery html angularjs

【解决方案1】：

我建议您仅在不确定 DOM 的工作原理以及如何在 angular 中拥有干净的 jquery 代码时尝试使用 Angular。

尝试引用Resizable columns with Angularjs

【讨论】：