I\'ve been looking for mechanism to update the model of a Route, and has the Component (called from within the template associated with that route) reacts to that event, and re-
You just need to watch the model. No?
update: function() {
var data = this.get('model').map(function(sales) {
return sales.get('amount');
});
d3.select(this.$()[0]).selectAll('div.h-bar')
.data(data)
.call(this.get('chart'));
}.property('model')
App.IndexRoute
is actually a class definition, not an instance.
For your particular case there are some important things to note here, find('type')
returns the all
filter which automatically updates as you add/remove items from the store. So you could just call find
again anywhere in the code (for that type), and it would automatically update your collection. Additionally you would want to control the updating at the route level, that way you don't keep updating when you aren't in scope.
App.IndexRoute = Ember.Route.extend({
model: function() {
return this.store.find('sales');
},
setupController: function(controller, model){
this._super(controller, model); // do the default implementation since I'm overriding this func
this.startRefreshing();
},
startRefreshing: function(){
this.set('refreshing', true);
Em.run.later(this, this.refresh, 30000);
},
refresh: function(){
if(!this.get('refreshing'))
return;
this.store.find('sales')
Em.run.later(this, this.refresh, 30000);
},
actions:{
willTransition: function(){
this.set('refreshing', false);
}
}
});
Example: http://emberjs.jsbin.com/OxIDiVU/825/edit
Additionally, for your component, you'd want to watch the array, not just the model itself (since the model reference won't update, meaning the observes method wouldn't be called). You would do something like this
watchingForModelChange: function(){
}.observes('model.[]')