Div的行爲就像使用Angular的Select下拉菜單

我有一個用戶界面要求，用戶需要點擊一個元素，顯示它的選項，並且選項是複選框輸入。Div的行爲就像使用Angular的Select下拉菜單

所以，一個'select'元素允許多個複選框輸入。

   <div class="select-custom" ng-click="selectToggle = !selectToggle"> 
        <div ng-show="all(x)">All Options<span class="arr"></span></div> 
        <div ng-show="!all(x) && !notAllowed(x)">Selected Options<span class="arr"></span></div> 
        <div ng-show="notAllowed(x)">No Options Selected<span class="arr"></span></div> 
       </div> 
       <ul class="list-unstyled select-custom-options" ng-show="selectToggle"> 
        <li ng-repeat="option in options"> 
         <input type="checkbox" value="{{option.Name}}" ng-model="option.Allow">{{option.Name}} 
        </li> 
       </ul>

的div是風格等的選擇輸入和ul包含的選項。一切運作良好，除了你需要點擊div來隱藏ul。通常，如果您在選項外單擊，則選擇元素將關閉。

關於如何將此行爲添加到像這樣的元素的建議？

來源

2016-01-21 Flignats

結帳：http://stackoverflow.com/questions/152975 /如何檢測點擊元素以外 – tymeJV

有一個與您的示例非常相似的指令。 http://dotansimha.github.io/angularjs-dropdown-multiselect/#/它有一個明確的標誌'closeOnBlur'，你可以設置爲false。 – jcc

$(document).mouseup(function (e) 
{ 
    var container = $("YOUR CONTAINER SELECTOR"); 

    if (!container.is(e.target) // if the target of the click isn't the container... 
     && container.has(e.target).length === 0) // ... nor a descendant of the container 
    { 
     container.hide(); 
    } 
});

從This answer

編輯container.hide到這樣的事情

container.attr('ng-show', 'false')

我認爲，將工作;）

來源

2016-01-21 19:36:25

Div的行爲就像使用Angular的Select下拉菜單

回答

相關問題