title: AngularJS use a function in a controller to return data from a service to be used in ng-repeat
body: <p>I am trying to use a function in a controller to return data so that I can re-use the function across the app to call the data as well as refresh it occasionally. </p>
  
  <p>My code appears correct, but in practice, crashes the browser on each load. </p>
  
  <p>I am able to get it to work by using an E directive and then placing the element in the partial, but that doesn't accomplish what I need. </p>
  
  <p>Ultimately, I would like to do something like this: </p>
  
  <pre><code>&lt;div ng-repeat="user in getListUsers()"&gt;{{ user.somedata }}&lt;/div&gt;
  </code></pre>
  
  <p>I have tried various things to get it to work in testing, including putting the $http in the controller, all with the same results. </p>
  
  <p>If I assign a variable in the controller method instead of returning the data, that works, but then I would need to call the method in the controller and I don't want it to run by default. Just looking to make the call in the templates when needed.  </p>
  
  <p>Any help in figuring out why this is not working would be great. Thanks. </p>
  
  <p>Here is what I have that is not functioning...</p>
  
  <pre><code>elite.controller('UserController', function($scope, User){
  
      $scope.getListUsers = function(){
          User.listUsers().then(function(response){
              return response.users;
          });
      }
  
  });
  
  elite.factory('User', function($http){
     var User = {
        getUser: function(id){
            return $http.get('/user/' + id + '/settings').then(function(response){
                return response.data; 
            });
        },
        listUsers: function(){
          return $http.get('/user/').then(function(response){
            return response.data;
          });
        }
     }
     return User;
  });
  </code></pre>
  
  <p><strong>Edit:</strong> </p>
  
  <p>Using some of the ideas below, I am able to get the functionality I wanted, just in a different way. Basically, I want the data to load on demand, rather that up front, as I am trying to group all User logic in that controller and I don't want the full data to load for every user. I am using $rootScope temporarily until I figure out some scoping inheritance issues, as using $scope.users ends up with a null value in the template. I can see the AJAX call coming back, but not sure where it's going, but that's another issue. </p>
  
  <pre><code>elite.controller('UserController', function($scope, $rootScope, User){
  
      $scope.getListUsers = function(){
  
          User.listUsers().then(function(response){
              $rootScope.users = response.users;
          });
      };
  
  });
  </code></pre>
  
  <p>And in a nav element I have this:</p>
  
  <pre><code>&lt;div ng-controller="UserController"&gt;
  &lt;a ng-href="/#user/list" ng-click="getListUsers()"&gt;user list&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>