title: How to update data in ngRepeat after successfully retrieving the JSON for custom url $http request
body: <p>Due to the fact that angularjs is not working with ngResource custom url, I have to try $http instead:</p>
  
  <p>My html is something like:</p>
  
  <pre><code>//html
  &lt;tr ng-repeat="person in people"&gt;
    &lt;td&gt;{{person.name}}&lt;/td&gt;
    &lt;td&gt;&lt;a ng-click="changeGender(person)"&gt;{{person.gender}}&lt;/a&gt;&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>my idea is after clicking the anchor in the html, a request will be sent to the server and update, then send the status with 200 back and update the gender in the view. I build a service and it look like:</p>
  
  <pre><code>//factory
  app.factory('changeGenderFactory', function($http, $q){
    return {
      getResult: function(person) {
        var deferred = $q.defer();
        $http({method: 'POST', url: '/resources/people/' + person.id + '/gender'}).
        success(function(data, status, headers, config){
          deferred.resolve(data);
        }).
        error(function(data, status, headers, config){
          deferred.reject(status);       
        });
        return deferred.promise;
      }
    };
  });
  </code></pre>
  
  <p>This is the controller:</p>
  
  <pre><code>//app
  var app = angular.module('someApp', []);
  //controller
  app.controller('peopleCtrl', function($scope, ngResource, changeGenderFactory) {
    //skip how i get $scope.people...
    //$scope.people = ...(use ngResource)
  
    $scope.changeGender = function(person) {
      return changeGenderFactory.getResult(person);
    };
  });
  </code></pre>
  
  <p>The ajax is working fine, but I guess something wrong with my controller part because the html is not updated at all. What should I do in order to update the data in ng-repeat in html? Thank you.</p>