--- title: "How exactly does data binding work in AngularJS?" description: "How exactly does data binding work in AngularJS?" author: "Sandra Emily" published: 2023-08-24 updated: 2023-08-26 canonical: https://www.mindstick.com/forum/159666/how-exactly-does-data-binding-work-in-angularjs category: "angular js" tags: ["database", "javascript", "angular js"] reading_time: 2 minutes --- # How exactly does data binding work in AngularJS? How exactly does [data](https://www.mindstick.com/articles/13050/salesforce-aiming-to-dominate-predictive-analytics-with-data-science) [binding work in AngularJS](https://www.mindstick.com/forum/158078/how-does-data-binding-work-in-angularjs)? ## Replies ### Reply by Aryan Kumar [Data binding](https://www.mindstick.com/articles/337466/exploring-data-binding-in-mvc-how-it-connects-model-and-view) in [AngularJS](https://www.mindstick.com/forum/33926/use-angularjs-without-scope-in-mvc) 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: - **One-way binding:** This is the simplest type of data binding. It allows you to bind a value from the model to an element in the view. When the value in the model changes, the element in the view is updated. - **Two-way binding:** This type of data binding allows you to bind a value from the model to an element in the view, and vice versa. When the value in the model changes, the element in the view is updated, and when the value in the view changes, the model is updated as well. - **Event binding:** This type of data binding allows you to bind an event from an element in the view to a function in the controller. When the event is triggered, the function is executed. 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. The `ng-bind` directive is used to bind a value from the model to an element in the view. The syntax for the `ng-bind` directive is as follows: ```plaintext ``` 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 the `h1` element in the view: ```plaintext

``` When the value of the `name` variable changes, the `h1` element is updated to reflect the change. --- Original Source: https://www.mindstick.com/forum/159666/how-exactly-does-data-binding-work-in-angularjs Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.