How to cancel model changes without using emberdata

1

I have a screen where I can edit my ‘Florida’ model (this can be any state). How can I undo my changes to the model and transition back to Florida (I’m not currently using emberdata)?

If I simply do a transitionTo, the changes are still in my model.

This is what my url looks like:

http://localhost:4200/editor/state/florida/edit

2

I stumble upon similar problem and I fixed it by passing deep copy of model to component. On ‘save’ click I am replacing existing model with copied one and on ‘back’ click I am doing nothing (only transition). I’m not sure if it’s “the ember way” but it worked for me.

I would love to hear some ember magician to tell me how it should be done in ember way.

3

Mike had a good point about Obervables so I’m not sure if using a copy of the model is a good idea.

What I ended up doing is:

cancel: function() {
      this.transitionTo('editor.state', this.modelFor(this.routeName).path + '?');
}

By appending the ‘?’, it caused my state route’s model hook to fire and do another lookup (which is what I want). I’m still curious if there is a more ‘ember’ way to do this without performing another call to my api.

My above solution still didn’t work.

4

I also “buffer” changes by making a copy on the controller. Another option for you might be to model.rollbackAttributes() before transitioning back one route/leaf. Also, assuming you are in a child of the editor.state route (eg: editor.state.edit), you don’t need to specify the model ID.

// app/controllers/editor/state/edit.js
// (snip)
actions: {
    cancel: function(){
        this.get('model').rollbackAttributes();
        this.transitionToRoute('editor.state');
    }
}
// (snip)
1 Like