Model isn't updating when I use a query

Ember Data
1

The model automatically updates if I use:

ST.FiltersSymbolsRoute = Ember.Route.extend({
  model: function() {
  return this.store.find('filter');
  }
});

But when I introduce a query, the model does not automatically update:

ST.FiltersSymbolsRoute = Ember.Route.extend({
  model: function() {
  return this.store.find('filter', {isSymbol: true});
  }
});

Here’s the fiddle: http://jsbin.com/yeyiroyo/1/

To replicate the bug, click Symbols, click “+”, type something, and hit enter You’ll notice that nothing happens, but if you click Users, then Symbols again – you’ll notice that the model has updated. How can we make it update immediately?

2

Stackoverflow would be the best venue of when asking for help. Please reopen, and cross link. I’ll gladly look at your question then.

3

The problem is that a query find is deferring to the server to return an array of records based on that query. There’s no way to have pre-existing query record arrays to automatically update from the server just from a .save() call alone; that would imply the server knowing to somehow know about all the existing query record arrays in place and re run that original query logic, send it back, and Ember would somehow know to manually update that record array. So as far as I know, query-based record arrays are kinda one-shot. I’m not the Ember Data pro so I’m not sure the most idiomatic way to go from here; maybe refiring the model hook in some way? (When the query-params-new feature flag is enabled, it adds a new method to Ember.Route called refresh which will refire the model hooks on that route and do an “in-place” transition, which you could try.)

4

That’s kind of what I was thinking too, haven’t had any luck with the ‘refresh’ method yet.

5

Thanks stefan:

6

update: this fixed it:

ST.FiltersSymbolsRoute = Ember.Route.extend({
model: function() {
   return this.store.filter('filter', function(record) {
      return record.get('isSymbol') === true;
   });
}
});
7

More concisely, you can write:

model: function() {
  return this.store.find('filter').findBy('isSymbol');
}
8

For future reference @balint’s solution is not the same thing and will not live update in the same way that @gravyfries solution will.

9

@alexspeller is right, sorry about that. I’d probably overlooked the use of this.store.filter in the original example.