1-way, 2-way, 3-way, ... or more data binding in AngularJS?

angularjs data-binding angular-ngmodel
JohnAndrews picture JohnAndrews · Dec 11, 2014 · Viewed 7.8k times · Source

Roughly speaking, 1-way data binding is simply binding with ng-model within the page and 2-way when controllers are involved. Can someone explain this concept to me so I really understand how to look at it? Also what is 3-way data binding and is there also 4-way, 5-way?

Answer

Antonello Pasella picture Antonello Pasella · Feb 24, 2015

(from JohnAndrews answer) 1-way data binding = your data model gets inserted into your views / templates usually from a controller and changes to your model in the controller change the data in your views. 2-way data binding = same as above, but you can make changes to your data model in the view as well.

3-way = your data is in sync with a remote storage (loke CouchDB) 4-way = your data is in sync with a local database (like localStorage or similar) and that database is in sync with a remote storage

Source https://docs.google.com/presentation/d/1NByDXl6YL6BJ6nL0G2DLyZs5Og2njE_MNJv6vNK5aoo/edit#slide=id.g34d447b28_10

Related questions

Ng-model does not update controller value

Probably silly question, but I have my html form with simple input and button: <input type="text" ng-model="searchText" /> <button ng-click="check()">Check!</button> {{ searchText }} Then in the controller (template and controller are called …

Read More
AngularJS : ng-model binding not updating when changed with jQuery

This is my HTML: <input id="selectedDueDate" type="text" ng-model="selectedDate" /> When I type into the box, the model is updated via the 2-way-binding mechanism. Sweet. However when I do this via JQuery... $('#selectedDueDate').val(dateText); It …

Read More
Angular - ng-change not firing when ng-model is changed

The input is the following: <input type="text" ng-model="repair.test" ng-change="action()" /> The action() is executed when I manually type and change the input. However if I change the repair.test value by some other function programmatically, …

Read More