Прокрутка страницы отключена с помощью ng-sortable

Question

Я создаю сортируемый список с AngularJS и угловой библиотекой ng-sortable. У меня проблема в том, что на мобильных устройствах поведение не согласовано. Страница не прокручивается при касании и перемещении списка (это желаемое поведение) на Android (Chrome), но на Ipad (Chrome)

Я создал простой пример, в jsFiddle, с базовым примером

JAVASCRIPT:

var myApp = angular.module('myApp',['ui.sortable']);

myApp.controller('MyCtrl', function($scope) {
    $scope.items = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19];

    $scope.sortableOptions = {
      orderChanged: function (event) {
        console.log("event", event);
      }
    };
});

HTML:

<div ng-controller="MyCtrl">
<ul as-sortable="sortableOptions" ng-model="items">
    <li class="display-item" as-sortable-item ng-repeat="item in items">
        <div class="handle" >
            <div class="item-handle" as-sortable-item-handle>
                {{item}}
            </div>
            <div class="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
        </div>
    </li>
</ul>

CSS:

.display-item {
    clear: both;    
}

.handle {
    border: 1px solid #e5e5e5;
    padding: 10px;
    margin: 0px;
}

.item-handle {
    background: grey;
    float:left;
    padding: 2px 5px;
}

/* ************************************** */
/* Mandatory CSS required for ng-sortable */
/* ************************************** */

.as-sortable-item, .as-sortable-placeholder {
    display: block;
}

.as-sortable-placeholder {

    background: pink;
}

.as-sortable-item {
    -ms-touch-action: none;
    touch-action: none;
}

.as-sortable-item-handle {
    cursor: move;
}

.as-sortable-placeholder {
}

.as-sortable-drag {
    position: absolute;
    pointer-events: none;
    z-index: 9999;
}

.as-sortable-hidden {
    display: none !important;
}

Answer 1

Пользователю лучше ngTable сортировать таблицы, я думаю, что это проще, я проверил это и работает правильно, вы можете следовать вот этому полному примеру: Пример

И это та часть кода, где вы добавляете сортировку таблицы

function demoController(NgTableParams, simpleList) {
this.tableParams = new NgTableParams({
  // initial sort order
  sorting: { name: "asc" } 
}, {
  dataset: simpleList
});

}

Но не используйте simpleList, просто следуйте примеру без него и поместите ваши данные вместо simpleList, после этого просто скопируйте html, посмотрите, как он работает, и добавьте ваши собственные атрибуты, я надеюсь, что помог вам, если у вас есть еще вопросы вы можете ответить на этот комментарий:P

Answer 2

Эта же проблема была зарегистрирована на сайте ng-sortable прямо здесь

Также есть опция longTouch / longTouchActive(старые версии <= 1.3.2), которую вы можете установить в true; Значение true приведет к активации функции перетаскивания при длительном касании, так же как касание и удержание на сенсорных устройствах.

Дайте мне знать, если это поможет на iPad, Android Chrome и т. Д.