What is the best way to install Angular on Rails 4?

Question

I have populated api using Rails and now wish to mount a front-end framework like Angular on Rails. I've seen people using Gulp or Grunt to do this, but still not 100%. Would love to see how experts efficiently stack Angular and Rails together. Much appreciated!

Answer 1

To get AngularJS on Rails is pretty straight forward, especially if you are using Rails as the API source.

1. Add the gems below to your Gemfile: gem 'bower-rails' gem 'angular-rails-templates'

2. Next do bundle install to install the gems.

3. Create a folder in your app/assets folder called templates. This is where you will keep your AngularJS html templates.

4. Place your package.json and bower.json at your project root.

5. Create a folder called client-test as you already have a test folder for your rails api - right?!

6. Ensure that your package.json references your client-test folder correctly.

The pertinent scripts section should look like this:

"test": "node node_modules/karma/bin/karma start client-test/karma.conf.js", "test-single-run": "node node_modules/karma/bin/karma start client-test/karma.conf.js --single-run",

7. For testing you are going to need to use karma-ng-html2js-preprocessor to convert the templates in your app/assets/templates folder.

That's it. Hope this helps!

Answer 2

Angular js is javascript framework to build single page application. when you think to use it with rails your front-end will be angular js and back-end will be postgresql or mysql and to connect database with front end you should have rails to handle request comes from user side. Response of the data will always be JSON. you just need to handle JSON data on front.

It means that your controller will just give JSON response. for that you should have only controller and model.

So take a look here, This will guide you through the angular js + rails binding, Its a good combination to use and love to use ever.

How to integrate Rails views with angularjs ng-view?

https://thinkster.io/angular-rails/