jQuery不適用於angularJs

Question

我正在嘗試使用jquery插件來調整表的列大小，這里有一個說明： 使用jQuery可調整大小的表列是colResiazable的一部分。 這個插件可以在標准的html表中工作：

<div id="searchTable">
    <div id="container" style="position: relative">

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

            </tr>
            <tr>
                <td class="">cell</td>

            </tr>
            <tr>
                <td class="">cell</td>

            </tr>
        </table>

    </div>
</div>

但它停止，當我使用angularJs表的工作：

<div id="searchTable">
    <div id="container" style="position:relative">
        <table id="normal" width="100%" border="0" cellpadding="0"
            cellspacing="0" class="">


            <tr class="tableList-head" >
            <th ng-hide="hd.hidden"  ng-repeat="hd in conf.heads">
                        {{hd.name}}
                    </th>
            </tr>


                <tr ng-repeat="data in conf.myData" >  
                    <td  ng-hide="d.hidden" ng-repeat="d in conf.heads">
                        {{data[d.name]}}</span>

                    </td>   
                </tr>   

        </table>

    </div>
</div>

angularJs表是一個角度指令：

.directive('angTable',['$compile',function($compile) {
                            return {
                                restrict : 'E',
                                templateUrl : 'components/table/tableTemplate.html',
                                replace : true,
                                scope : {
                                    conf : "="
                                },
                                controller : function($scope,$rootScope) {

這里的指令的聲明中添加我為make jQuery代碼的jQueryplugin工作：

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

現在，在第一個表中它可以工作，而在第二個表中則不能。 我看了一些關於DOM的angularJs修改，我想這個問題應該是，我的意思是，也許ID為“正常”的表沒有retrived，但我新的角度，我不知道如何解決它。 任何建議將不勝感激

Answer 1

為此，您必須在angular之前包含jQuery庫，並且必須將該代碼放入DDO的 link函數中：

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