Three-way data binding

You've seen how easy and cool synchronizing the changes from the server is. However, AngularFire takes it a notch further by introducing three-way data binding, whereby it is able to detect local changes, so we don't even have to call $save(). We just have to call $bindTo() on a synchronized object and any changes in the DOM are pushed to Angular and finally to Firebase. Conversely, any changes to the data get pushed to Angular and finally to the DOM.

So let's see it in action. The code for this example is very similar to the one we used in the synchronized arrays example, with a few changes. Here's the modified app.js file:

app.config(function ($routeProvider) {
  $routeProvider
    .when('/', {
      templateUrl: 'main.html'
    })
    .when('/buildings', {
      templateUrl: 'building/buildings.tpl.html',
      controller: 'BuildingsCtrl'
    })
    .when('/buildings/:buildingIndex',...

Data Oriented Development with Angularjs

By : Manoj Waikar

Data Oriented Development with Angularjs

By: Manoj Waikar

Overview of this book

Three-way data binding

Unlock full access

Continue reading for free

Data Oriented Development with Angularjs

By : Manoj Waikar

Data Oriented Development with Angularjs

By: Manoj Waikar

Overview of this book

Three-way data binding

Unlock full access

Continue reading for free

Delete Bookmark

Confirmation

Buy this book with your credits?