Binding on view with dependency

Question

I am using a view to bind data to a contentEditable div using the code found in the answer to this question: Ember and HTML5 contenteditable property

I have a property a.b.c that I'm binding it to like so:

{{view App.ContenteditableView valueBinding="a.b.c"}}

This correctly updates a.b.c when I type in it, and it updates itself when I modify a.b.c. However, It does not update when I change a to a different object. That is, the text box needs to update when a or b changes, not just when c changes.

How is this done?

Kingpin2k Kingpin2k · Accepted Answer · 2014-06-10T00:59:01

Ember already supports this if you properly use the built in setters.

if a extends Ember.Object a.set('b', { c: 'asdf'}) if a is a POJO Ember.set(a, 'b', { c: 'asdf'}).

Additionally using valueBinding isn't necessary, you can just write value=a.b.c

In the provided example I set the text box to a.b.c

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return {
      a:{
        b:{
          c:'dog'
        }
      }
    };
  },
  actions:{
    change: function(){
      Em.set(this.currentModel, 'a', {b:{c:'fdasdf'}});
    }
  }
});

Example: http://emberjs.jsbin.com/toticame/1/edit

Binding on view with dependency

1 Answers