Complex multi-filter routes in Ember

Question

My app has (somewhat complex) filtering requirements, in that a user is able to filter on two types of categories, each of which must allow sub-categories. Oh yeah, I must allow multiple categories and sub-categories, and I want each combination to have a shareable, and (somewhat) readable URL.

To put it concretely, here is the generalized scheme I've come up with illustrated by an example:

/ontario[toronto,waterloo],quebec/accommodations[hotels],attractions

This would show Hotels (sub-category of Accommodations) and all Attractions in the cities of Toronto and Waterloo in Ontario province, and in any city in Quebec province.

So basically:

"/{comma-seperated regions with comma-seperated towns in square braces}/{comma-seperated categories with comma-seperated subcategories in square braces}"

I'm pretty sure this won't work by default, and being somewhat new to Ember, I'm wondering where to start with this scheme. Probably I'll have to override the routes (and perhaps link-to?) somewhere.

Any general tips would be appreciated!

If you think this is a terrible idea, I welcome that feedback too. The alternative is an even uglier query-param method, so I kind of like this right now.

Answer 1

After spending some time understanding the Ember Router, this ended up being pretty straight-forward.

In the route's "model" method, I simply use the params hash to deduce the proper model to use. This isn't so straightforward in my case because of the complex dynamic portions of my URL, but this was mainly just string-mangling code.

The other side of it is overriding the "serialize" method on the route. This does the opposite of the "model" method, and returns a hash of the dynamic "params" for a particular model object. This is used to serialize a model into the URL.

With these two methods implemented properly, it works beautifully.