How exactly does data binding work in AngularJS?
How exactly does data binding work in AngularJS?
25824-Aug-2023
Updated on 26-Aug-2023
Home / DeveloperSection / Forums / How exactly does data binding work in AngularJS?
How exactly does data binding work in AngularJS?
Aryan Kumar
26-Aug-2023Data binding in AngularJS is the synchronization of data between the model and the view. When data in the model changes, the view reflects the change, and when data in the view changes, the model is updated as well. This happens immediately and automatically, which makes sure that the model and the view are always in sync.
There are three types of data binding in AngularJS:
Data binding in AngularJS is done using directives. Directives are special attributes that you can add to elements in the view. Each directive has a specific purpose, such as binding data or handling events.
The most common directive for data binding is the
ng-bind
directive. Theng-bind
directive is used to bind a value from the model to an element in the view. The syntax for theng-bind
directive is as follows:Where
value
is the name of the variable in the model that contains the value to be bound.For example, the following code binds the value of the
name
variable in the model to theh1
element in the view:When the value of the
name
variable changes, theh1
element is updated to reflect the change.