Ember JS: Remove record from hasMany relationship and update view

ember-data, ember.js

Solution

You need to include a `belongsTo` relationship inside your `App.Tweet` model. For example,

App.Tweet = DS.Model.extend({
    date: DS.attr('date'),
    text: DS.attr('string'),
    containsURL: DS.attr('boolean'),
    user: DS.belongsTo('App.User'),
});

Now when you call `tweet.deleteRecord()`, the corresponding user model's `tweets` relationship will also be updated. Here's a jsfiddle.

Problem

I'm trying to delete a record from store and automatically update the view that lists the items, but so far I had no luck. I tried `tweet.deleteRecord()` in the `delete` method of the controller but it seems it removes all "tweets" a user has, it doesn't update the view and when trying to access the user tweets again I get an error. What is the proper way to delete a record from the store, update any relationships the record might have and also update the view? Bellow is part of my code: Model ``` App.Store = DS.Store.extend({ revision: 11, adapter: 'DS.FixtureAdapter' }); App.User = DS.Model.extend({ screenName: DS.attr('string'), name: DS.attr('string'), profileImage: DS.attr('string'), url: DS.attr('string'), followersCount: DS.attr('number'), description: DS.attr('string'), tweetsCount: DS.attr('number'), friendsCount: DS.attr('number'), tweets: DS.hasMany('App.Tweet') }); App.Tweet = DS.Model.extend({ date: DS.attr('date'), text: DS.attr('string'), containsURL: DS.attr('boolean') }); ``` Controller ``` App.UserController = Ember.ObjectController.extend({ delete: function(tweet) { // code to delete tweet both from // App.Tweet and App.User.Tweets relationship // and automagically update the view } }); ``` View ``` <script type="text/x-handlebars" data-template-name="user"> <h3>{{ controller.name }}</h3> <ul> {{#each tweet in tweets}} <li> {{ tweet.text }} - <a href="#" {{action "delete" tweet}}>Delete</a> </li> {{/each}} </ul> </script> ```

Original source