title: Angular fire ng-click on row but not on href
body: <p>I've made a page with bootstrap, and i would like to have an action when the user clicks on the row. This is easy, I put <code>ng-click</code> on the <code>div</code> that is the row.</p>
  
  <p>However, inside the row elements I've a link, and I would like to avoid the firing of the <code>ng-click</code> when the user clicks on the link (in that case it should open the url of the link)</p>
  
  <p>this is a <a href="https://www.dropbox.com/s/583aa53hmsdmh8q/Screenshot%202015-05-29%2017.54.31.png?dl=0" rel="nofollow">picture</a> of the row. Bascially if the use clicks anywhere except the link simbol it should filre the ng-click, if it clicks on the link simbol it should open the url.</p>
  
  <p>is this possible?</p>
  
  <p>PS: I tried to put <code>ng-click</code> on each item except the href element, but the href element is inside a column within other things, and if I don't put the <code>ng-click</code> on the column it will not fire if the use clicks on the empty space of the column.</p>
  
  <pre><code>&lt;div class="col-sm-8" &gt;
     &lt;a href="{{club.url}}" &gt;&lt;i class="fa fa-link"&gt;&lt;/i&gt;&lt;/a&gt; |
     &lt;span class="h5 small"&gt;{{club.description}}&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>