Observing array attribute

Question

I have an attribute in my model that is an array (of floats) and is serialized and returned as such by my Rails backend. I then take the field, (monthlyData in this example) and plot it using a D3-based component that I wrote.

{{bar-chart dataBinding="monthlyData" height=75 width =300}}

Everything works fine, except when the data changes. In the JS of my component I have an observer that observes the data attribute of the component and re-renders the view, however this observer is not fired if my model changes. It does, however fire if I set the monthlyData field directly, e.g. by doing this.get('model').set('data', [1,2,3,4,5]) in my controller.

I have tried both not specifying an attribute type (i.e. in my model specifying monthlyData: DS.attr() and using a custom array transform (in the hope that the returned Ember.Array would be observer-friendly):

App.ArrayTransform = DS.Transform.extend({
  deserialize: function(serialized) {
    return Ember.A(serialized);
  },
  serialize: function(deserialized) {
    return deserialized.toArray();
  }
});

I'm using Ember 1.3 beta 1 and Ember Data 1.0.0 beta 4. What's the best practice around using arrays as data types and how do I make them observable?

Answer 1

You might want to observe data.@each instead of data to monitor Arrays.