title: Angular ngClick: only works in some cases
body: <p>I'm trying to override an <code>&lt;a&gt;</code> link with ng-click, but it only works when I have loaded the page using the base URL.</p>
  
  <p>I realise this sounds weird, but you can see the consequence by comparing <a href="http://afmnew.herokuapp.com/" rel="nofollow">http://afmnew.herokuapp.com/</a> with <a href="http://afmnew.herokuapp.com/criteria/price/1" rel="nofollow">http://afmnew.herokuapp.com/criteria/price/1</a> and using the buttons on the right to apply filters. In the latter case you will see the map flashes as it reloads, whereas in the former is simply deletes and adds the markers.</p>
  
  <p>This is the key pieces of code, stating with the HTML:</p>
  
  <pre><code>&lt;div class="btn-group btn-group-justified price"&gt;
      &lt;a href="criteria/price/1" class="btn btn-default" ng-click="main.applyFilter($event)"&gt;Budget&lt;/a&gt;
      &lt;a href="criteria/price/2" class="btn btn-default" ng-click="main.applyFilter($event)"&gt;Mid-range&lt;/a&gt;
      &lt;a href="criteria/price/3" class="btn btn-default" ng-click="main.applyFilter($event)"&gt;Fine dining&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is the relevant function in my controller. The controller definitely gets loaded when I use the longer URL as this controller processes the URL to apply the relevant filter. I don't know where to begin trying to track down the problem now.</p>
  
  <pre><code>angular.module 'afmnewApp'
  .controller 'MainCtrl', (Restos, $stateParams, $state, Dictionary) -&gt;
  
      this.reset = () -&gt;
          console.log "MainCtrl: reset"
          this.data.offcanvas = false
          Restos.reset()
  
      apply = (q, v) -&gt;
          Restos.data.headTitle = "The Amsterdam Foodie's top "+Restos.data.pageTitle
          Restos.data.metaDescription = "The Amsterdam Foodie's top "+Restos.data.pageTitle
          if v == 'price'
              Restos.data.pageTitle = Dictionary.prices[q-1].name + " "+ Dictionary.prices[q-1].suffix
              Restos.priceFilter parseInt q
          else
              Restos.data.pageTitle = Dictionary.cuisines[q].name + Dictionary.cuisines[q].suffix
              Restos.cuisineFilter q  
  
      this.applyFilter = (event) -&gt;
          console.log event.target.href
          event.preventDefault()
          params = event.target.href.match(/criteria\/(.*)\/(.*)$/)
          console.log("MainCtrl: applyFilter: ", params) if Restos.debug
          this.data.offcanvas = false
          # $state.transitionTo 'criteria', {criteria:params[1], q:params[2]}, {inherit:false}
          # stateObj =
          #    criteria: params[1]
          # history.pushState({}, "null", "criteria/"+params[1]+"/"+params[2]);
          apply params[2], params[1]
  
      this.data = Restos.data     # needed to pass click from navbar
      # preparePage = () -&gt;
      console.log "MainCtrl: loading..."
      # Restos.data.offcanvas = false
      # This code causes the problem
      if $stateParams.criteria
          q = $stateParams.q
          ga 'send', 'pageview', '/'+$stateParams.criteria+'/' + q
          # Restos.data.intro = false
          # console.log "mainCtrl: Criteria type %s, value %s", $stateParams.criteria, q if Restos.debug
          apply $stateParams.q, $stateParams.criteria
      else
          ga 'send', 'pageview', '/'
          Restos.data.pageTitle = "Restaurant recommendations"
          Restos.data.headTitle = "Restaurant recommendations by the Amsterdam Foodie"
          Restos.data.metaDescription = "The Amsterdam Foodie's top restaurant recommendations from among 400 reviews"
          # default filter is applied anyway
  </code></pre>