ember.js v1.0.0-rc.1 — Using a modal outlet, how do I route out of the modal on close?

Question

I'm attempting to render all my modals through application routing, but I'm having trouble figuring out the proper way to return to a previous state after I dismiss the modal.

Here's the basic setup:

I have an outlet in my application template which I'm using to display modal dialogs.

It looks something like:

{{ outlet modal }}

In my route mappings, I've defined hooks for the individual modal. For instance, my help dialog pops up with:

App.HelpRoute = Ember.Route.extend({
    renderTemplate: function(controller, model) {
        this.render({ outlet: 'modal' });
    }
});

Right now, I can display my modal through the uri:

   foo.com/#/help

I have a hook to dismiss the modal using jQuery:

$('#modalHelpWindow').modal('hide');

But this doesn't really help, because I'm just hiding the element. I need to update URI on dismissal. If I hit the same route again, the modal is already hidden, and doesn't display.

What methods should I be using to dismiss the modal, and route the application back to its previous state? Should I just be using history.back()?

Note, I am aware of this SO question, but the solution is not the preferred 'ember' way of doing things, as programmatically created views will not have their controllers associated properly What's the right way to enter and exit modal states with Ember router v2?

Answer 1

Looks like I can hook up the hidden handler to do a history.back() call in my view's didInsertElement method, a la:

   didInsertElement: function() {
        var $me = this.$();
        $me.modal({backdrop:"static"});
        $me.on('hidden', function() {
            history.back();
        });
    },