angular-dragula – 使用angularjs-dragula的水平滚动问题

发布时间：2020-12-17 07:15:39 所属栏目：安全来源：网络整理

导读：我正在使用 angularjs-dragula,我无法自动滚动到屏幕隐藏的溢出容器. 这是我的问题：我的拖拉机中有五个容器,第五个容器隐藏在屏幕上.现在我想从第一个容器中拖出一个元素并将其放在第5个容器中.但我无法做到这一点,因为屏幕不会自动滚动到第5个容器. angul

我正在使用 angularjs-dragula,我无法自动滚动到屏幕隐藏的溢出容器.

这是我的问题：
我的拖拉机中有五个容器,第五个容器隐藏在屏幕上.现在我想从第一个容器中拖出一个元素并将其放在第5个容器中.但我无法做到这一点,因为屏幕不会自动滚动到第5个容器.

angularjs-dragula是否支持垂直滚动？或者是否有我失踪的财产？

示例Plunkr：https://plnkr.co/edit/iD38MugmHIx298p7OlrI?p=preview

var app = angular.module('angular-dragula-demo',[angularDragula(angular)]);
app.controller('MainCtrl',function($scope,dragulaService) {
    dragulaService.options($scope,'fifth-bag',{
        copy: true
    });
});

解决方法

似乎这个选项没有在Dragula中实现. Dragula的开发人员建议使用模块dom-autoscroller.

在Github上看到这个问题：https://github.com/bevacqua/dragula/issues/121

要使用AngularJS实现此功能：

1)从官方仓库：https://github.com/hollowdoor/dom_autoscroller/blob/master/dist/dom-autoscroller.min.js下载dom-autoscroller

2)将其包含在项目文件夹中

3)在控制器中启用自动滚动：

// ENABLE AUTOSCROLL FOR GOALS LIST
var scroll = autoScroll([
    document.querySelector('.list')
],{
    margin: 30,maxSpeed: 10,scrollWhenOutside: true,autoScroll: function () {
        //Only scroll when the pointer is down
        return this.down
    }
});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!