Javascript 带有AngularJS 1.2.2的可拖动表格列（从1.0.8开始的poss中断更改？）

我有一个表，允许通过拖放对列标题进行重新排序。列标题绑定到角度模型，但最后一列始终固定。我使用jquery UI dragtable来处理拖放方面（使用简单的自定义指令连接）

这在Angular 1.0.8中运行得很好，但升级到1.2.2后，有时最后一个固定列会移动到表的中间，角度模型与视图不同步

使用1.0.8使用JSFIDLE： 使用1.2.2破坏JSFIDLE：（将col3一直拖到左侧以重新创建，请注意表下的UL元素显示了错误的列顺序）

（两者包含完全相同的代码，唯一的区别是使用的angular版本）

看法 我很感激我可能不是以角度的方式来做这件事，因此如果您能建议更好的方法，请让我知道。

您可以点击以下链接：

<div ng-app="myapp" ng-controller="TestCtrl">
    <table id="tab1">
        <tr>
            <th class="accept" drag-table ng-repeat="col in model.cols">{{col}}</th>
            <th class="static">STATIC</th>
        </tr>
    </table>

    <ul>
        <li ng-repeat="col in model.cols">{{col}}</li>
    </ul>
</div>

var myapp = angular.module('myapp', []);

myapp.controller('TestCtrl', function ($scope) {
    $scope.model = {};
    $scope.model.cols = ['Col1', 'Col2', 'Col3'];

    $scope.dragTableDone = function(){
        $scope.model.cols = [];
        $('#tab1 th:not(.static)').each(function () {
            console.log('pushing ' + $(this).text());
            $scope.model.cols.push($(this).text());
        });
        $scope.$apply();
    };
});

myapp.directive('dragTable', function() {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            scope.$watch('$last', function (v) {
                if (v) {
                    $(element).closest('table').dragtable({ maxMovingRows: 1, beforeStop:scope.$parent.dragTableDone, dragaccept: '.accept' });
                }
            });
        }
    };
});

$(function() {
    $('table').dragtable();
});