AngularJs get Form Input Value – Working with the forms in AngularJs we often need to get the form input values in controller. It is very easy to get the form input field values in controller. Here in this tutorial we are going to explain how you can get the form input field values in controller. You can use our online editor to edit and run the code online.
Angularjs get Form Input Value In Controller | Form Data Example
You can get the form data simply as below –
JavaScript Part :
JavaScript Part Contains the following script as below –
Angularjs get Form Data Example:
|
|
The above function imports the user object from the form. Here you can manipulate the object as per your need.
Html Part :
Html Part Contains the following html as below –
Angularjs get Form Data Example:
<div ng-app="myApp">
<div ng-controller="myController">
<p>User Data Json = {{userData | json}}</p>
<p>Name = {{userData.name}}</p>
<p>Email = {{userData.email}}</p>
<p>Phone = {{userData.phone}}</p>
<p>Location = {{userData.location}}</p>
</div>
</div>
|
Complete Part :
Now let us combine both javascript and html part to create full example –
Angularjs get Form input value in controller & View
<div ng-app="myApp">
<div ng-controller="myController">
<p>User Data Json = {{userData | json}}</p>
<p>Name = {{userData.name}}</p>
<p>Email = {{userData.email}}</p>
<p>Phone = {{userData.phone}}</p>
<p>Location = {{userData.location}}</p>
</div>
</div>
|
if you run the above example it will produce the output something like this –