CODEWITHSUNDEEP
javascriptember.js
AJP
AJP

Reputation: 545

Ember reset items in Ember data when returning to route

I have a route in my Ember app which returns a set of records in the model hook like so:

model() {
  return this.store.findAll('pending-post');
}

Assuming this returns 10 records, I can see the 10 records in the data tab of Ember Inspector, and when I log {{model}}. The network tab also shows that an array of 10 records returned in the data object.

I then go to another route in my app and edit a post so that it is no longer pending. This change is persisted to the backend.

When I return to the dashboard, the model hook runs again. The request in the network tab now returns an array of 9 objects, as the API is only returning 9 items.

However, the data tab in Ember inpector still shows 10 items and there are still 10 items in {{model}}.

What is the best way to force Ember data to remove the item that was not returned by the API the second time around?

Upvotes: 1

Views: 111

Answers (1)

Vignesh Raja
Vignesh Raja

Reputation: 8731

Persisting the record to the backend returns a Promise. Hence store.unloadRecord() can be used in the then handler to remove the record from the store.

record.save().then(function(){
    this.store.unloadRecord(record);
});

Or before querying for the model, remove all records from the store.

model()
{
    this.store.unloadAll('pending-post');
    return this.store.findAll('pending-post');
}

The model name can be camelCased or dasherised.

Upvotes: 1

Related Questions