Ember CLI path based on server response

Question

I'm developing a substantial ember app, using Ember CLI, and I'm struggling with a few aspects of it.

What I want to do is:

1. Show a dropdown list of options
2. When the user picks an option, post their choice to the backend
3. The response from the server contains data based on what the user picked in the dropdown. After getting the server response I want to transition to a new route where the path ends with one of the values returned by the server.

For example:

/path/to/dropdown -- shows the dropdown for the user to pick from, which is then POSTed to the backend. The backend responds with, amongst other data:

 slug: <stringValue>

This then transitions to: /path/to/slug -- where slug is <stringValue>

So far I've got 1 & 2 above working, but I can't figure out how to make step 3 work. I've tried using a serialize function in the /path/to/slug route and the /path/to/dropdown controller, but it always returns undefined.

The AJAX call to the server, based on the user's dropdown choice, happens in the /path/to/dropdown controller.

I've set up the router as:

this.route('options', { path : ':slug' });

Would be great if someone could point me in the right direction; I hope my example is clear enough but let me know if not.

Thanks.

Answer 1

To be honest I don't understand why do you use this.route('options', { path : ':slug' });. You just created the only route for all possible options (in fact, for all urls of form /anything), but that's not what you want.

I think your solution is this.transitionToRoute(url_string) which is available in any controller. Check the api example there. But before you should declare all that routes in the router and create operating files for them, of course.

If you don't want to create a route for each possible slug, so then your route is pretty excellent, but at least I'd consider to add one more path section. For example, this.route('options', { path : '/slugs/:slug' });. After that you can run transitionTo and pass data (in any format) to it. The data will be assigned to the route model and you will be able to use it in the SlugRoute (and SlugController, if you didn't redefined the setupControler method) as a this.get('model') variable.

If you want to run transition from the view, firstly you need to obtain the controller and send a special command to it.