NudeCanalTroll
NudeCanalTroll

Reputation: 2286

Detect model/URL change for Ember Route

My EmberJS application has a ProjectRoute (/project/:project_id) and a corresponding ProjectController. When viewing a particular project, users can edit its properties, and I'd like the project to automatically be saved when the user stops looking at it.

Currently, what I'm doing is something like this:

Application.ProjectRoute = Ember.Route.extend({
  ...
  exit: function() {
    this.get('controller').saveProject();
  }
  ...
});

This works when the user simply closest the project view. However, if the user simply switches to viewing a different project (e.g. goes directly from /project/1 to /project/2), the same route is used (it just uses a different model), and exit is not called.

What I need is a way to detect this transition and call the saveProject function before it happens. Any ideas?

Upvotes: 0

Views: 718

Answers (1)

NudeCanalTroll
NudeCanalTroll

Reputation: 2286

I "solved" it by adding the following to my controller:

Application.ProjectController = Ember.ObjectController.extend({
  ...
  saveOnChange: function() {
    var previousProject = this.get('target.projectToSave');
    if (previousProject && previousProject.get('isDirty')) {
      Application.store.commit();
    }

    this.set('target.projectToSave', this.get('content'));
  }.observes('content')
  ...
});

This seems to work well. Note that I'm storing the projectToSave property in the route (target) as opposed to the controller, because the controller gets wiped every time the model changes. It feels a little weird/hacky to store this in the route, but the only alternative I could think of was to store it in ApplicationController, which seemed overly broad.

Upvotes: 0

Related Questions