title: Angular: ng-click and <li> items
body: <p>I'm using the fabulous <a href="https://angular-ui.github.io/bootstrap/" rel="nofollow">UI Bootstrap</a> for Angular but am having difficulty getting an onclick event raised.</p>
  
  <p>Here is the code:</p>
  
  <pre><code>&lt;ul class="dropdown-menu" role="menu"&gt;
      &lt;li&gt;&lt;a&gt;&lt;img src='/Content/Images/dept_cargo.png'/&gt; CARGO&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a&gt;&lt;img src='/Content/Images/dept_commercial.png'/&gt; COMMJ&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a&gt;&lt;img src='/Content/Images/dept_executive.png'/&gt; EXECJ&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a&gt;&lt;img src='/Content/Images/dept_travel.png'/&gt; TVL&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  {{ currentDepartment }}
  </code></pre>
  
  <p>I've tried every combination: putting the ng-click="behaviour()" variously inside the li, the a and the img, but nothing seems to work.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>(ideally I'd just like to change the value of a scope variable but I'm thinking calling a behaviour to do the work is better practice)</p>
  
  <p>This question is not the same as suggested above. The other question is to do with scope, whereas I would be happy just to be able to execute an alert(); from one of my li's.</p>