title: Angularjs refreshing after action same page
body: <p>I'm trying to load a function on a link click, which works perfectly. Then angularjs does its magic until it arrives on the point where it shows the user feedback. I need to refresh the page after deleting an item, but it simply won't refresh. </p>
  
  <p>Here's my href:</p>
  
  <pre><code>&lt;a ng-click="deleteGroup(group.id)" target="_self"&gt;
  &lt;img src="img/deleteGroupIcon.png" width="45px"/&gt;&lt;/a&gt;
  </code></pre>
  
  <p>here's my Controller:</p>
  
  <pre><code>$scope.deleteGroup = function ($groupId) {
      $http({
          method: 'POST',
          url: apiUrl + 'group/delete',
          data: {'groupId': $groupId},  // pass in data as strings
          //headers: {'Content-Type': 'application/x-www-form-urlencoded'}  
          // set the headers so angular passing info as 
          // form data (not request payload)
      })
      .success(function (data) {
          if (!data.success) {
              //$route.reload();
              alert('groep is verwijderd');
          } else {
              $scope.group = data;
              //$state.go('userDetail', {'user_id' : $userId});
          }
      });
  };
  </code></pre>
  
  <p>and my html:</p>
  
  <pre><code>&lt;div class="searchResults" ng-repeat="group in groups | searchForUser:searchString"&gt;
  &lt;div class="manageGroupWrapper"&gt;
      &lt;a class="normal" href="#"&gt;
          &lt;div class="newName h3"&gt;
              {{group.title}}
          &lt;/div&gt;
          &lt;div class="newProfile"&gt;
              &lt;img ng-src="{{group.image}}" width="200px"/&gt;
          &lt;/div&gt;
          &lt;div class="imageWrapper"&gt;
              &lt;a ui-sref="add_group" class="editGroupIcon"&gt;&lt;img src="img/editGroupIcon.png" width="50px"/&gt;&lt;/a&gt;
              &lt;a ng-click="deleteGroup(group.id)" target="_self"&gt;&lt;img src="img/deleteGroupIcon.png" width="45px"/&gt;&lt;/a&gt;
          &lt;/div&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>