Getting empty Array from WebAPI and SQL Server in AngularJS

Question

In my project I'm getting an empty array from database. I'm using SQL Server, WebAPI 2 and for the client side AngularJS to display the data from the database. I don't know what is wrong.

Here is the client side code:

$http.get('/api/group')
  .success(function (data, status) {
     $log.info('Data:', data);
     $log.info('Status:', status);
  })
  .error(function (data, status) {
     $log.info('Data:', data);
     $log.info('Status:', status);
  });

WebAPI Controller of group:

public class GroupController : ApiController
{
  public EtfContext db = new EtfContext();

  // GET api/group
  public IQueryable<Group> GetGroups()
  {
    //var groups = from g in db.QR_Groups
    //             select g;
    //return groups;
    return db.QR_Groups;
  }

The Model of group:

public class Group
{
    public Group()
    {
    }

    public int Id { get; set; }
    public string name { get; set; }
    public string code { get; set; }
}

And the DataContext for connecting to the database:

public class EfContext : DbContext
{
  public EfContext() 
    : base("name=EfContext")
    {
    }

  public DbSet<Group> QR_Groups { get; set; }
}

The Table in the database called "QR_Groups" with 3 columns: id, name, code. How do I get the data from the database?