AngularJS ng 拖动

Question

我是 AngularJS 的新手，我对当前的项目有点压力，这就是我在这里问的原因。

我看到 AngularJS 有 ng-dragstart 事件( http://docs.ng.dart.ant.c-k.me/angular.directive/NgEventDirective.html )，但它似乎不起作用。在其他页面上，我可以看到其他开发人员建议执行新的“指令”。

所以我的问题是:“AngularJS 中是否实现了原生 ng-drag 功能，还是我应该自己实现？”

Answer 1

如果您不想使用已经制作的，则需要自己实现它。我自己拼凑了一些东西。

我需要的是一种在 Angular 上下文中使用拖动事件的简单方法。我想要其他 ng-events 具有的完全相同的功能，只是还有拖动事件。我查看了来源here大部分复制了源代码如何创建 ng-event 指令。

包含 ngDrag 作为依赖项。您可以使用所有 ng-drag* 事件。

(function(){
    var ngDragEventDirectives = {};

    angular.forEach(
        'drag dragend dragenter dragexit dragleave dragover dragstart drop'.split(' '),
        function(eventName) {
            var directiveName = 'ng' + eventName.charAt(0).toUpperCase() + eventName.slice(1);

            ngDragEventDirectives[directiveName] = ['$parse', '$rootScope', function($parse, $rootScope) {
                return {
                    restrict: 'A',
                    compile: function($element, attr) {
                        var fn = $parse(attr[directiveName], null, true);

                        return function ngDragEventHandler(scope, element) {
                            element.on(eventName, function(event) {
                                var callback = function() {
                                    fn(scope, {$event: event});
                                };

                                scope.$apply(callback);
                            });
                        };
                    }
                };
            }];
        }
    );

    angular
        .module('ngDrag', [])
        .directive(ngDragEventDirectives);
}());