Question

I typed the following code on “documentation” page on emberjs.com
http://emberjs.com/documentation/

But, it does not show the result that I expect.
Why is that?

App.wife = Ember.Object.create({
    householdIncome: 80000
});

App.husband = Ember.Object.create({
    householdIncomeBinding: 'App.wife.householdIncome'
});

console.log(App.husband.get('householdIncome')); //it shows 80000

App.husband.set('householdIncome', 90000);

**console.log(App.wife.get('householdIncome')); // it shows 80000 not 90000**
console.log(App.husband.get('householdIncome')); // this shows 90000

I’m expecting to get 90000 when I type console.log(App.wife.get(‘householdIncome’));,
as the example code on ember.js says.

Does anyone know what’s wrong?
Please give me a help.

Thanks!!

Answer 1

From that same documentation:

Note that bindings don’t update immediately. Ember waits until all of your application code has finished running before synchronizing changes, so you can change a bound property as many times as you’d like without worrying about the overhead of syncing bindings when values are transient.

You can wrap your console.log statements with Ember.Run.next to make sure the binding updates are applied before they run.

App.husband.set('householdIncome', 90000);

Ember.run.next(function() {
  console.log("her income: " + App.wife.get('householdIncome')); // it shows 90000
  console.log("his income: " + App.husband.get('householdIncome')); // it also shows 90000
});​