javascript - anchor 内的复选框

Question

我有以下代码:

   <a href class="dropdown-toggle">
       <input type="checkbox" ng-model="test.checked">
       <span class="fa fa-angle-down"></span>
   </a>

我想让复选框在单击上面时显示选中标记。现在，单击链接只会显示下拉列表，而不会选中该框。

我尝试使用 $event.stopPropagation() :

   <input type="checkbox" ng-click="testProp($event)" ng-model="test.checked">

   $scope.testProp = function($event){
      $event.stopPropagation();
   }

在复选框上，但是遗漏了 anchor 标记，我只会选中该复选框并且不显示下拉列表。

这个解决方案有特定的 Angular 吗？大多数其他解决方案都是针对 jquery 的。

Answer 1

<input type="checkbox" ng-model="checked">
<a href class="dropdown-toggle" ng-click="checked = !checked">
   <span class="fa fa-angle-down"></span>
</a>