data not being fetched from resouce.query of angular js

Question

I am new to angular and rails. I am trying to fetch the user from db and want to show it over screen as index page. I am able to fetch the data in the rails controller, but getting empty in angular controller

angular controller:

app = angular.module("userApp", ["ngResource"])
app.controller("userController", function($scope, $resource, $http){
User = $resource('/users', {}, {query: {method: "GET", isArray: true}}) 
    $scope.users = User.query()
    alert($scope.users)
});

Rails controller: class UsersController < ApplicationController respond_to :html

def index
@user = User.all
@user.each do |u|
    puts u.name
end
    respond_to do |format|
      format.html # index.html.erb
      format.json { render json: @user }
    end
end
end

I am getter $scope.users as empty. Please help me out on this.

Thanks, JK

Answer 1

You are trying to access the resource before it is ready. Use the success callback instead

... 
app.controller("userController", function($scope, $resource, $http){
 ... 
   User.query({}, function(data){
      $scope.users = data;
      alert($scope.users)
   })  
});