Question

我有定时器，定期从服务器加载数据。这些数据应在同一页面上以表格形式表示。用户可以添加新表单，当表单添加时，对服务器的查询也会更改并开始为新表单加载数据。这些表格也应该是draggabe和可调整大小。

我尝试使用ng-repeat进行此操作，但这会因为重新加载div而中断我的可拖动和可调整大小（我的可拖动视图的坐标会在每次从服务器加载数据后重置）。

部分HTML：

<div     ng-repeat="dev in devices" style="border:1px solid grey;">
    <div  draggable_  style="width:400px" class="ui-widget-content" ng-include=  "'partials/' + dev.type + '.html'"></div>
</div>

控制器：

diagApp.controller('diagCtrl', ['$scope', '$http', '$timeout','$compile',
    function ($scope, $http, $timeout, $compile) {
        var cmds = [];
        $scope.devices = [];
        var onTimer = function() {
           var path = location.href;
           path = path.replace(/diagpro.*$/, 'diagpro/my1_json.php')
           var onSucc = function(data) {
               for (var t in data) {
               var tp = data[t].cmd;
               $scope.devices[tp] = data[t];
           }
           $scope.devices = data;     
        }
        $http({
           method: 'POST',
           url: path,
           data: cmds.join(' '),
           headers: {'Content-Type': 'application/x-www-form-urlencoded'},

        }).success(onSucc);      

       $timeout(onTimer, 1000);

 }]);

draggable指令：

diagApp.directive('draggable_', function () {
    return {
        restrict: 'A',
        scope: {
            callback: '&onDrag'
        },
        link: function postLink(scope, elem, attrs) {
           elem.draggable();
           elem.on('dragstop', function (evt, ui) {
              if (scope.callback) { scope.callback(); }
           });
       }
   };
});

因此，动态添加不同视图模板的新实例会带来问题。我怎么能用angularjs做这个？

动态添加角度视图

0 个答案: