Observe properties on nested object

Question

Example fiddle: http://emberjs.jsbin.com/aviyUnA/9/edit?html,js,output

This is my model:

{
  name: {
    title: 'Mr',
    first: 'Potato',
    last:  'Head'
  },

  age: 79
}

How do I create a computed property that observes all the keys inside the name object without listing them manually?

fullName: function() {
  var name = this.get('name');
  return [name.title, name.first, name.last].join(' ');
}.property('name.??')

Thanks for any help!

I'm pretty sure you would have to list them all in that case. See this question also. — Gabriel G. Roy
I was worried about that. In this case it's not that big of a deal but definitely something to keep in mind. Thanks for your answer. — user2858236

Panagiotis Panagi Panagiotis Panagi · Accepted Answer · 2013-10-08T19:26:02

You can customize the set call of your model: Check if the value being set involves a property of name and if it does, call notifyPropertyChange on name:

App.MyModel = Ember.Object.extend({
   set: function(keyName, value) {
     this._super(keyName, value);
     if (keyName.indexOf('name.') > -1) {
       // a property of `name` has changed => notify observers of `name`
       this.notifyPropertyChange('name');
     }
   }
});

Demo: http://emberjs.jsbin.com/akEjubU/1/edit

Observe properties on nested object

1 Answers