如何滚动md-dialog面板而不关闭它？

Question

您好我正在使用角度素材md-dialog manel。

    $mdDialog.show({
            templateUrl: 'rt.tmpl.html',
            parent: angular.element(document.body),
            controller: 'SomeController',
            controllerAs: 'vm',
            targetEvent: event,
            clickOutsideToClose: true,
            multiple: true,
            fullscreen: self.isCustomFullscreen      
        })

正如你所看到的，我使用clickOutsideToClose：true（我需要它）。 但我同时右边有一个滚动条（见图）。问题是，当我点击滚动时，面板关闭.. 怎么避免呢？

提前致谢!!!））））

Answer 1

这似乎基本上是一个 CSS 问题。默认情况下，对话框的最大高度和最大宽度分别为90vh和90vw。因此，如果您的内容溢出对话框的高度，则滚动条应显示在对话框内，而不是窗口中。

尝试将md-dialog-content的高度设置为90vh减去md-dialog-toolbar和md-dialog-actions的高度：

md-dialog-content {
  max-height: calc(90vh - $mdDialogToolbarHeight - $mdDialogActionsHeight);
}

Answer 2

我已经修好了

   clickOutsideToClose: false,

并将侦听器应用于md-dialog parent：

 var dialogContainerEl =  document.getElementsByClassName("md-dialog-container")[0];

            dialogContainerEl.addEventListener("click", function (event) {
                hidePanel();
            });

它现在有效。谢谢你们！