Question

我想禁用向下拖动以关闭mdbottomsheet的手势。我找到了一个关于脚本的工作，但我不确定在哪里放置代码。谢谢你的帮助。

Answer 1

正如您所说，角度材料没有提供任何禁用它的选项，显然您必须对其源代码进行更改。

现在，您还没有提到是否要在特定位置禁用它，或者为所有地方的bottomSheets转向向下拖动。

1）如果是后者，那将非常简单，因为你唯一需要做的就是删除拖拽事件的事件监听器。如果你使用angular-material.js文件，那么你可以做什么：

找到函数 BottomSheet（element，parent）。此函数基本上注册关闭工作表的拖动事件。我们需要让它不附加听众。

将其减少为：

function BottomSheet(element, parent){
   return {
      element: element,
      cleanup: angular.noop
    };
}

清理函数基本上在拖动事件上取消注册侦听器。当底层的范围被销毁时调用此函数。为了进行最小的更改，我们只是简化了清理功能，无所事事。

2）如果您希望能够在控制器中创建工作表时传递选项，则可以执行相同的操作，但有条件地基于您传递的选项。不要编写代码，因为我假设您知道角度是如何工作的，但这里是步骤：

=＆GT;添加一个布尔变量以及其他选项（模板，范围等）。让我们称之为 dragDownToClose 。

=＆GT;在MdbottomSheet的提供程序函数内的默认注入器函数中，为其指定一个默认值（true / false）。

=＆gt;在onShow函数中实例化BottomSheet（）期间，将它与元素和父元素一起传递。

=＆GT;所以BottomSheet（）现在有三个参数 - dragDownToClose是新的参数。

=＆GT;正如我们在前一种情况下所做的那样，当值为false时返回没有附加任何处理程序的元素，并让原始函数为真时。

当然，有多种方法可以实际实现这一点。但是，我希望你能得到这个想法。

Answer 2

首先，将$element注入您的控制器。你知道AngularJS $元素做了什么，对吗？

然后我们都知道拖拽事件已在BottomSheet

中注册

parent.on('$md.dragstart', onDragStart)
    .on('$md.drag', onDrag)
    .on('$md.dragend', onDragEnd);

所以，简单的解决方案是：删除这些事件，覆盖这些事件......而不覆盖function BottomSheet，对吗？

            $element
            .on('$md.dragstart', function (ev) {
                return false;
            })
            .on('$md.drag', function (ev) {
                return false;
            })
            .on('$md.dragend', function (ev) {
                return false;
            });

这里还有一些问题！背景仍然拖拉！所以，我们为背景做同样的事情

var parent = $element.parent();
var backdrop = parent.find('md-backdrop');
backdrop
                .on(blah blah blah

如果您要求

，这些是code

Answer 3

你可以尝试

$mdBottomSheet.show({
                      template: *yourTemplate*,
                      clickOutsideToClose:false
                   })

即使在外面拖动或点击，也不会让用户关闭底部工作表。

mdbottomsheet禁用向下拖动以关闭

3 个答案: