title: Checkbox inside anchor
body: <p>I have the following code: </p>
  
  <pre><code>   &lt;a href class="dropdown-toggle"&gt;
         &lt;input type="checkbox" ng-model="test.checked"&gt;
         &lt;span class="fa fa-angle-down"&gt;&lt;/span&gt;
     &lt;/a&gt;
  </code></pre>
  
  <p>I would like to have checkbox show the checked mark when the above is clicked. Right now, clicking the link would only show the dropdown and not check the box.</p>
  
  <p>I tried using $event.stopPropagation() :</p>
  
  <pre><code>   &lt;input type="checkbox" ng-click="testProp($event)" ng-model="test.checked"&gt;
  
     $scope.testProp = function($event){
        $event.stopPropagation();
     }
  </code></pre>
  
  <p>on the checkbox, but that leaves out the anchor tag and I would only have the checkbox checked and the dropdown not shown.</p>
  
  <p>Is there an angular specific for this solution. Most of the other solutions are geared towards jquery.</p>