在 angularjs 上使用 dragular 移动滚动

Question

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

(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);
    });
  }
})();

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

Answer 1

我在这里看到三种可能的解决方案。最简单的方法是在用户可以在不与项目交互的情况下移动触摸的一侧留一些空白 space。更好的解决方案是对项目 DEMO 创建一些处理程序。或者第三种解决方案，你可以像你提到的那样延迟做更具挑战性的解决方案。这可以通过使用 moves property with combination of browser timers and drag.start 防止拖动来完成。但是我没有这方面的演示，这将是您的自定义解决方案。

在 angularjs 上使用 dragular 移动滚动

Mobile scroll using dragular on angularjs

javascript

angularjs

dragular