Question

我在Angularjs中创建了一个很酷的选择框，所有代码都运行良好没有问题，我面临的唯一问题是没有运气来解决它是：

以下是我的选择框标记：

 <div id="selectBoxContainer" ng-click="isOpen=!isOpen">
    <span>Title</span>
   <input type="text" ng-model="q">
 </div>
  <ul id ="selectboxResult" ng-show="isOpen">
     <li ng-repeat="r in result">{{r}}</li>
  </ul>

到目前为止，它有效，当我点击此 div 或其中的任何子项（假设标题元素）时， ul 将切换显示和隐藏。

问题：

当我点击这个div的外面（在外面的任何地方）我想要关闭这个选择框（isOpen = false），我知道我必须抓住 document.click 事件并做一些事情有了它，但我不确定如何使用它。

Answer 1

如果适合您，请尝试使用以下链接。

http://plnkr.co/edit/4J7jBQ?p=preview

<select ng-model='selectedIndex' ng-class="disabled"}}">
<option ng-repeat='student in students' value='{{$index}}'>
   {{student.id}} - {{student.name}}
</option>

单击其外部时关闭选择框

1 个答案: