title: ngClick not firing in nested ngRepeat filled with data from $http.post()
body: <p>I have an AngularJS app to search for journeys. In the part of the problem I am trying to show all available countries per region. The idea is that when you click a country, a function has to be executed. But it never fires...</p>
  
  <p>Any help?</p>
  
  <h1>View</h1>
  
  <pre><code>&lt;div id="headersearch" ng-controller="ProductSearchController"&gt;
      &lt;div id="headersearchContainer"&gt;
          &lt;input id="tripchoise" class="field" type="text" placeholder="Hoe ver wil je gaan?" ng-model="country" ng-change="switchView('countries')" ng-blur="switchView('')" ng-focus="switchView('countries')" /&gt;
          &lt;div id="triptypechoise"&gt;
              &lt;div class="triptype" ng-class="{active: filter=='single'}" title="Singlereizen" ng-click="switchFilter('single')"&gt;&lt;img src="/Resources/Images/Layout/singlereis.png" alt="Singlereizen" /&gt;&lt;/div&gt;
              &lt;div class="triptype" ng-class="{active: filter=='custom'}" title="Maatwerkreizen" ng-click="switchFilter('custom')"&gt;&lt;img src="/Resources/Images/Layout/maatwerk.png" alt="Maatwerkreizen" /&gt;&lt;/div&gt;
              &lt;div class="triptype" ng-class="{active: filter=='group'}" title="Groepsreizen" ng-click="switchFilter('group')"&gt;&lt;img src="/Resources/Images/Layout/groepsreis.png" alt="Groepsreizen" /&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;div id="tripdeparturedatechoise" class="field arrow"&gt;
              {{date}}
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="headersearchButton"&gt;
          &lt;a href="#" class="bookbutton"&gt;&lt;span&gt;ZOEK&lt;/span&gt;&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class="clear"&gt;&lt;/div&gt;
      &lt;input type="text" class="datepicker datehide" id="searchdepartureDate" ng-model="date" datepicker/&gt;
      &lt;div id="searchList" ng-class="{hide:view==''}"&gt;
          &lt;div class="loadingproducts" data-ng-show="loading"&gt;Loading products...&lt;/div&gt;
          &lt;article class="searchentry" ng-show="view=='countries'"&gt;
              &lt;div class="" ng-repeat="region in regions"&gt;
                  &lt;p&gt;{{region.Name}}&lt;/p&gt;
                  &lt;ul&gt;
                      &lt;li ng-repeat="country in region.Countries"&gt;
                          &lt;a ng-click="test()"&gt;{{country.Name}}&lt;/a&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/article&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <h1>CONTROLLER</h1>
  
  <pre><code>SearchApp.controller("ProductSearchController", function ($scope, $http) {
      $scope.date = "Vertrek";
      $scope.filter = "single";
      $scope.view = "";
      $scope.country = "";
      $scope.switchFilter = function (filter) {
          if ($scope.filter != filter) {
              $scope.filter = filter;
              $scope.search();
          }
      }
      $scope.switchView = function (view) {
          if ($scope.view != view)
              $scope.view = view;
          if ($scope.view != "" &amp;&amp; $scope.view != "countries")
              $scope.search();
      }
      $http.post("/AVProductList/GetCountriesByRegionAsync")
          .success(function (response) {
              $scope.regions = response.regions;
      });
      $scope.search = function () {
          $scope.loading = true;
          $http.post("/AVProductList/SearchProductsHeader?view="+ $scope.view +"&amp;filter=" + $scope.filter, { SearchParameters: {Country: $scope.country}})
            .success(function (data) {
                if ($scope.filter == "custom")
                    $scope.trips = data.results;
                else {
                    if ($scope.view == "trips")
                        $scope.trips = data.grouped.RoundtripgroupCode.doclist.docs;
                    else if ($scope.view == "departures")
                        $scope.trips = data.response.docs;
                }
            });
      };
      $scope.changeDate = function () {
          if (isValidDate($scope.date)) {
              $scope.view = "departures";
              $scope.search();
          }
          else { 
              $scope.date = "Vertrek";
              $scope.view = "trips";
          }
      }
      $scope.selectCountry = function (name, code) {
          $scope.countrycode = code;
          $scope.country = name;
          $scope.view = isValidDate($scope.date) ? "departures" : "trips";
          $scope.search();
      }
      $scope.test = function () {
          alert("Hoi");
      }
  
  
  });
  </code></pre>
  
  <p>Json result example of </p>
  
  <pre><code>$http.post("/AVProductList/GetCountriesByRegionAsync")
          .success(function (response) {
              $scope.regions = response.regions;
      });
  
  {
    regions:[
    {
      Name:"Asia",
      Countries: 
      [
        {
           Name: "China",
           Code: "CH"
        }
        ,...
      ]
    }  
    ,...
    ]
  }
  </code></pre>