I am building a rails app using RABL that generates an API on my data controlled by Active Admin. It's a really simple API and I don't have much data yet, but I am newer to Angular.js and client side apps. Using rabl, I make an API on 2 objects. Here is my code so far;
project.rb
class Project < ActiveRecord::Base
has_attached_file :image, :styles => { :small => "100x100", :medium => "200x200", :large => "300x300" },
:url => "/system/members/:id/:style/:basename.:extension",
:path => ":rails_root/public/system/members/:id/:style/:basename.:extension"
validates_attachment :image, content_type: { content_type: ["image/jpg", "image/jpeg", "image/png"] }
end
projects_controller.rb
class ProjectsController < ApplicationController
def index
@projects = Project.all
respond_to do |format|
format.json { render }
end
end
end
views/projects/index.html.rabl
collection @projects
attributes :id, :title, :short_description, :long_description, :client, :image
member.rb
class Member < ActiveRecord::Base
has_one :image
has_attached_file :image, :styles => { :small => "100x100", :medium => "200x200", :large => "300x300" },
:url => "/system/members/:id/:style/:basename.:extension",
:path => ":rails_root/public/system/members/:id/:style/:basename.:extension"
validates_attachment :image, content_type: { content_type: ["image/jpg", "image/jpeg", "image/png"] }
end
members_controller.rb
class MembersController < ApplicationController
def index
@members = Member.all
respond_to do |format|
format.json { render }
end
end
end
views/members/index.html.rabl
collection @members
attributes :id, :name, :title, :bio, :facebook, :twitter, :instagram, :linkedin, :dribbble, :image
Angular;
app/assets/javascripts/app.js
var app = angular.module("onyx", ["ngResource"]);
app.factory("Member", [ //member for the member object
"$resource", function($resource) {
return $resource("/member/:name", { //trying to just start by getting the name
name: "@name"
}, {
update: {
method: "GET"
}
});
}
]);
Update: Thanks to this fantastic tutorial, I got everything working.
I have since made a couple apps with angular and rails. Once you make your app, generate an API on all of your data. Once you do that Angular takes care of the rest. Using gems in my opinion is not the best, and you can use the rails asset pipeline to your advantage by using angular via CDN.
The best resources I have found to learn how to get rails and angular to play nice together, are these two tutorials: