How to link to an element that has both a param and non-param route

1

So in the Router I kinda have something that looks like us.

  this.route('contact', { path: '/contact/:product_id'});
  this.route('contact');

The way our website works is if a user clicks on the “Request a Sample” from a certain product’s page, that page will put the product’s id into the URL and then the contact form will autofill the product the user is requesting a sample for. I have it set up like this in my product’s page.

{{link-to 'contact' myProductID} class="btn btn-primary btn-lg"}`

The problem is that the productID is clearly not being passed. I suspect this is because “link-to” only uses the URL of the last this.route(‘contact’) defined. Therefore it assumes I don’t require any parameters. I could make the contact route require a product_id, but the problem is that there are several links which don’t use any parameters.

Is there a way for {{link-to}} to specify that I want to use this.route('contact', { path: '/contact/:product_id'}); instead of this.route('contact');?

2

I’m on my phone on the seat of a tractor and don’t have code in front of me to show a snippet, but ‘yes’.

The route syntax is nestable.

1 Like
3
4

You have two routes with the same name. Routes must have unique names.

5

That’s because their supposed to link to the same route.

It’s just that I want one that links without any arguments and another that links with arguments.

6

If it’s exactly the same form then it should have the same URL. You should look at using query parameters instead, i.e. /contact?product=1

2 Likes