1

通过移动浏览器滚动时我遇到了一些问题。页面将显示图像列表，用户可以通过拖放来重新排列图像的顺序，但是滚动页面时出现问题，而不是滚动，它只是在图像（拖放）动作之间切换位置。这是我的 plunk样本

(function() {
  angular
    .module('app', ['dragularModule'])
    .controller('appController', ['$scope', 'dragularService', '$timeout', appController]);

  function appController($scope, dragularService, $timeout) {
    var vm = this;
    vm.items = [{
      content: 'Item 1'
    }, {
      content: 'Item 2'
    }, {
      content: 'Item 3'
    }, {
      content: 'Item 4'
    }, {
      content: 'Item 5'
    }, {
      content: 'Item 6'
    }];

    dragularService('.drag-content', {
      containersModel: vm.items,
      scope: $scope
    });

    $scope.$on('dragulardrag', function(e) {
      $timeout(function() {
        e.stopPropagation();
      }, 2);

    });
    $scope.$on('dragulardrop', function(e) {
      $timeout(function() {
        e.stopPropagation();
      }, 2);
    });
  }
})();

我的问题是，是否可以延迟拖放操作并进行滚动。

4

1 回答 1

0

我在这里看到了三种可能的解决方案。最简单的方法是在用户可以在不与项目交互的情况下移动触摸的一侧留下一些空白空间。更好的解决方案是在项目DEMO上制作一些处理程序。或者第三种解决方案，您可以像您提到的那样延迟做更具挑战性的解决方案。这可以通过使用move属性结合浏览器计时器和drag.start来防止拖动来完成。但我没有演示，这将是您的自定义解决方案。

于 2017-01-09T07:50:20.870 回答