AngularJS is the client-side JavaScript Framework and works based on an MVC design pattern. Ruby on Rails is a server-side application framework based on an MVC design pattern. The diagram below is a quick representation of how Angular JS works seamlessly with RAILS MVC.
The power of Angular JS is the client-side data manipulations which we use for various User Interface Use Cases like Lists, Refine Search, Graphical Data Representation etc and present the Web Application to the user as a Single Page Application.
Building the single-page applications (SPAs for short) using Angular JS and Ruby on Rail is a two-step process: first you create a JSON API in Rails and then you use that API in the JavaScript application.
The AngularJS Controllers interact with RAILS Controllers. The object data from the RAILS Model (M) is passed to the AngularJS Controllers via Rails Controller(C) using Restful API services. The view part of the application is the Angular JS framework in MVC design pattern, dropping the View in Rails.
This way the true potential of AngularJS is utilized for building the Single Page Application and Rails is capitalized for its server side implementation using its Models and Controllers. The layers interact using Restful JSON API services.
