html - 如何在单击时隐藏 Angular 下拉菜单

Question

我有一个下拉菜单，如果选择了某些东西，它会关闭，但如果没有选择任何东西，它会保持打开状态。我正在尝试这样做，以便在单击 fa fa-caret-down 箭头时关闭它，但它没有起到作用。我该如何解决？这是该部分的代码:

  
<label  style="color:white;">How many players?</label>
<div ng-class="{true:'error-bron', false:'nonerror-bron'}[dropDownPeopleError===true]" class="dropdown" ng-click="test()">
   <span>{{dropDownPeople}}</span>
   <i class="fa fa-caret-down bron-caret" aria-hidden="true" ng-click="test(); $event.stopPropagation();"></i>
   <div class="dropdown-content" ng-show="form.showDropDownPeople">
      <a ng-repeat="item in people" ng-click="changePeople(item); $event.stopPropagation();">{{item}}</a>
   </div>
</div>             

这是我的 Controller 的一部分

$scope.test = function(){
    $scope.form.showDropDownPeople  = true;
}

Answer 1

您可以使用 ng-show 隐藏元素，其中元素仅在标签内的表达式为真时显示，即 ng-show="showDropDownPeople"