As we know that
Ruby and Rails is a great for building
the backend (Server) Apis. AngularJs is great for building the client side
JavaScript Applications. So by combining both of these together for building
the applications then surly they will deliver a
great products. So I think AngularJs is a great tool for building the
application with Ruby on Rails.
Lets
proceed for using AngularJs in our Rails Application:
Step
1: Create a
rails application like lets say ‘angulardemo’
Step
2: Add gem
"angularjs-rails" to your gem file and do bundle.
Step
3: Now bind
the ng-app="myapp" with html tag in application.html.erb like:
<html ng-app="myapp">
And in application.js just add
//= require angular
The
ng-app directive defines that this is an
AngularJS application
Step 4: Make a
controller with index action and set this as root in route.rb
Step
5: Now we are
going to make a simple form that will take a book name from user and add this
name in the books list shown below.
So
for this first of all we have to put a html form with name attribute that will
be the book name.
Step
6: Now
add ng-model="newEntry.name"
with this text box like:
<input
type="text" name="name" placeholder="Type a name
here" ng-model="newEntry.name" autocomplete="off">
Here
‘ng-model’ binds the value of
HTML controls like select,input etc to application data.
And ‘newEntry’ is
the object that will working with in this form and name being an attribute that
will set on this object for this given field.
Step 7: Now put {{newEntry.name}}
below the form
this will print
the model value when you will type in the textbox now. So refresh your page and
try to write in your text field and look you will notice same text will appear
below the form what you are typing now.
So in this Part we
have learn how to use AngularJs in our Rails Application.
In Next part we
will discuss the working with controller and submit this form and add this name
to a list.
If you are, looking to Develop
and design for your project then feel free to contact us at any
time
- Call Us- +91 9910781148, +1 8033353593
- Email: company@tecorb.com
- Skype- tecorb
“We maintain transparency with our customers . Our values and
business ethics has given us repeated customers. We tend are proud to be a
reliable outsourcing partner for many clients across the World.”
No comments:
Post a Comment