Ember Data 'find' with parameters prevent new record from displaying

Question

I'm trying to add new record to Ember Data store, and it expected to be displayed immediately. Spent few hours trying to figure out why it isn't displayed, and found, that passing parameters to Ember Data store.find prevents it.

So this code works:

App.FlagsRoute = Ember.Route.extend({
  model: function(params) {
    return this.store.find('flag');
  }
});

App.FlagsController = Ember.ArrayController.extend({
  init: function() {
    this.store.createRecord('flag');
  }
});

JSBin: http://jsbin.com/OxIDiVU/409/edit

There is one new record in the bottom of the table being displayed, as expected.

And when I'm adding only one thing, the params to 'find' query, it stops working.

So this code breaks new records diplaying:

App.FlagsRoute = Ember.Route.extend({
  model: function(params) {
    return this.store.find('flag', params);
  }
});

JSBin: http://jsbin.com/OxIDiVU/407/edit

New record actually added to Ember Data store, but not shown in table.

GJK GJK · Accepted Answer · 2014-04-24T11:44:35

Your problem is that you're creating a record in the init function of your controller. Your route's model hook is called before your controller is instantiated for the first time, so it's not finding the record because it doesn't exist. The first one works because the find method called with no parameters returns an array that updates as new records are added. Calling it with parameters doesn't do that.

Your init function is a terrible place to create records anyway. You shouldn't be dealing with any kind of persistent state in that function. Ideally, records should be created in controllers, at runtime, as the result of user interaction. If you give us a little more information about your use case and how you want to create a new flag, I can help you a bit more.

Ember Data 'find' with parameters prevent new record from displaying

1 Answers