从路由emberjs中删除动态路段信息

Question

I have an ember engine, and within that I have defined a route. It works as expected. It's called my-route . It was defined like this:

this.route('my-route', {path: '/my-route/:myparams'}); in the routes.js file.

As you can see, it has a dynamic segment, and shows different values based on myparams .

I want to add a nested route to this route . Let's say .../my-route/1 shows a list of items. When the user clicks on any of the items listed on the page, the route should be: my-route/display but instead its my-route/1/display . I don't want the 1 here as it could be misleading.

Also, the link-to doesn't open anything either, the click does nothing. This is how I changed my routes.js file:

this.route('my-route', {path: '/my-route/:myparams'}, function() { this.route('display'); });

In display.hbs file I added dummy data, and display.js is also empty, just extending from Ember.route . The my-route.hbs links like this:

{{#link-to 'my-route.display'}} Open me {{/link-to}}'

I am new to EmberJS, and would appreciate if someone could please tell me how to:

1. Remove the dynamic segment information
2. Make the link-to work

Thank you!

Answer 1

1) I can think of no easy way to remove dynamic segment from the url -- if you must, you can probably just not use dynamic segment and send the information to the transitioning route via other ways - you can probably set the controller directly "newRoute.controller.set('someProperty', my_param);" or use needs api ( http://emberjs.com/guides/controllers/dependencies-between-controllers/ )

but note that both these methods would be making use of controllers. If you need to load data in the route depending on the query params, what comes to mind is using a service

But these methods are not very sophisticated and I'd say only go for it if dynamic segment is an absolute no.

2) this one is easier -- you need to pass in the dynamic part along with the route name when using link to -- as given in ember guide https://guides.emberjs.com/v2.0.0/templates/links/

Answer 2

Based on the discussions with @Lux and @Chhirag Kataria, I ended up making two separate routes. I used the my-route as a dummy route, and nested the display and the list routes in it.