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です。したがって、コンテンツがダイアログの高さをオーバーフローした場合、スクロールバーはウィンドウ内ではなくダイアログ内に表示されます。

90vhするコンテンツMD-ダイアログマイナスMD-ダイアログツールバーとMD-ダイアログ・アクションの高さの高さを設定してみてください：

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

Answer 2

私はそれを

clickOutsideToClose: false, 

を修正しました

とMD-ダイアログの親にリスナーを適用：それは今フィン作品

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

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

。みんなありがとう！