What is data binding in AngularJS

0 votes
Want to know about what is the use of data binding in Angularjs??
Jan 23, 2020 in Web Development by kartik
• 37,510 points
225 views

1 answer to this question.

0 votes

Data binding is synchronization of data between the model and view components. 

In Angular, model treat as source of application and view is the projection of angular model.

There are two type of data binding in Angularjs they are:

                1. One-Way data binding

                2. Two-Way data binding.

In One-way data binding view ( i.e UI part) not updates automatically when data model changed and we need to write custom code to make it updated every time and it is not a synchronization processes.

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>

AngularJs Two Binding Example

</title>

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<script type="text/javascript">

var app = angular.module('angulartwobindapp', []);

app.controller('angulartwobindingCtrl', function ($scope) {

$scope.name = 'Welcome to Edureka.com';

});

</script>

</head>

<body ng-app="angulartwobindapp">

<div ng-controller="angulartwobindingCtrl">

<p>

Message:   {{ name }}

</p>

</div>

</body>

</html>

 In Two-way data binding, view (UI part) updates automatically when data model changed. It is a synchronization processes.

<!DOCTYPE html>

<html xmlns="http://www.edureka.co/">

<head>

<title>

AngularJs Two Binding Example

</title>

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<script type="text/javascript">

var app = angular.module('angulartwobindapp', []);

app.controller('angulartwobindingCtrl', function ($scope) {

$scope.name = 'Welcome to Tutlane.com';

});

</script>

</head>

<body ng-app="angulartwobindapp">

<div ng-controller="angulartwobindingCtrl">

Enter Name : <input type="text" ng-model="name" style="width:250px" />

<p>

Entered Name:   {{ name }}

</p>

</div>

</body>

</html>

answered Jan 23, 2020 by Niroj
• 82,680 points

This article will help to know about data binding in angularjs. https://www.tutlane.com/tutorial/angularjs/angularjs-data-bindings-one-way-two-way-with-examples

Related Questions In Web Development

0 votes
1 answer

What does cors means in Angularjs and what the use of it?

CORS is Cross Origin Resource Sharing which means you ...READ MORE

answered Jan 29, 2020 in Web Development by kartik
• 37,510 points
2,686 views
0 votes
1 answer

What is "XX" in CXX in a cmake CMakeLists.txt file ?

Due to the macro identifiers limitations which ...READ MORE

answered Feb 8 in Web Development by Rahul
• 8,980 points
58 views
0 votes
1 answer

What is the difference between span and div?

The div should be used to wrap sections of ...READ MORE

answered Jan 16, 2020 in Web Development by Niraj

edited Jan 21, 2020 by Niroj 2,183 views
0 votes
1 answer

How can we avoid my php form from hacking?

Hii @kartik, If you want to know php ...READ MORE

answered Feb 13, 2020 in PHP by Niroj
• 82,680 points
1,278 views
0 votes
1 answer

How can you display the error messages?

Hey, In the HTML form, we add ...READ MORE

answered Feb 13, 2020 in PHP by Niroj
• 82,680 points
316 views
0 votes
1 answer

What is a Cookie? How to create Cookies With PHP?

A cookie is often used to identify ...READ MORE

answered Feb 13, 2020 in PHP by Niroj
• 82,680 points
1,852 views
0 votes
1 answer

Complete PHP form with proper validation and syntax

Hey @kartik, It's quite simple to have php ...READ MORE

answered Feb 19, 2020 in PHP by Niroj
• 82,680 points
522 views
+1 vote
1 answer

What is the relationship between angularjs Scope with controller/view?

Let us consider the below block: <div ng-controller="emp"> ...READ MORE

answered Jan 20, 2020 in Web Development by Niroj
• 82,680 points

edited Jan 21, 2020 by Niroj 368 views
+1 vote
1 answer

What are pseudo class in css??

Hey, The state of an element is controlled  by ...READ MORE

answered Jan 20, 2020 in Web Development by Niroj
• 82,680 points

edited Jan 21, 2020 by Niroj 267 views
webinar REGISTER FOR FREE WEBINAR X
Send OTP
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP