在mdDialog中，角度材質md-select不關閉

我正在使用角材質版本1.1.4，角度版本1.5.9，並且我對md-select指令有以下問題。在mdDialog中，角度材質md-select不關閉

我打開一個對話框，使用$ mdDialog服務點擊一個按鈕。該對話框是全屏。裏面我有多個輸入，以及一個MD選擇輸入。在md-select上，您可以選擇多個項目，因此從列表中選擇一個項目後它不會自動關閉。打開它並選擇你想要的項目後，點擊它以外的關閉它並進入下一個輸入，但在mdDialog窗口中使用時，其外部的單擊事件不會關閉md-select。

我搜索了這個問題，發現了幾個問題，但其中一些幾個月沒有答案，其他問題沒有解決方案。

非常感謝您的時間，希望您可以用乾淨的方式幫助我做到這一點。或者，我將不得不手動添加單擊事件，我寧願避免。

來源

2017-05-31 florinmtsc

您是否找出修復方法？我有同樣的問題。 – Holt

我找到了一個修復程序。這不是最漂亮的，但它的工作原理。你可以做的是在md-select之外獲得點擊事件（你希望你的用戶點擊關閉md-select）並使用$ mdSelect服務來隱藏它（$ mdSelect.hide（）） – florinmtsc

我如何解決這個問題：

var dialogContainer = angular.element(document.querySelector('.bara-cautare-directive-root')), 
     mdSelects = document.getElementsByTagName('md-select'); 

    dialogContainer.bind('click', function (event) { 
     var closeMdSelect = true; 

     _.forEach(mdSelects, function (mdSelect) { 
      mdSelect = angular.element(mdSelect); 
      // what I do here is to check if the click event was triggered by the md-select I want to close. When opening the md-select, it will automatically close it, so I make sure that whenever this md-select is clicked, I don't hide it. 
      if (mdSelect.is(event.target) || mdSelect.has(event.target).length != 0) { 
       closeMdSelect = false; 

       return false; 
      } 
     }); 

     if (closeMdSelect) { 
      $mdSelect.hide(); 
     } 
    });

來源

2017-07-25 18:22:50 florinmtsc

積分到用戶@Lihini。請參考此處的答案：https://stackoverflow.com/a/46169071/873976

該問題可以通過覆蓋md-backdrop的zindex來解決。只需添加以下css

.md-select-menu-container { 
    z-index: 900; } 

md-backdrop.md-select-backdrop { 
    z-index: 899; }

來源

2018-01-22 10:47:16

在mdDialog中，角度材質md-select不關閉

回答

相關問題