Why does parent route model refresh when visiting nested route?


#1

I’m having an issue where the parent route refreshes every time I visit a nested route.

the router is setup as:

this.route(‘something’, { path: ‘something/:id’, }, function() { this.route(‘add-new-image’); });

So, say a user visits:

/something/1234

Then clicks “Add A New Image” which uses the link-to helper to go to “something.add-new-image”.

The display for the parent route refreshes and then the new route’s model loads. Even when they hit the back button, the parent model refreshes again.


#2

@tsteuwer this is a guess, but I think it has something to do with the fact that your parent route takes a route param (‘id’) but the child route ignores it. So when you navigate to ‘something.add-new-image’ you’re actually changing the parent route from (and this is just my own syntax nothing official) something:1234 to something:<undefined>.add-new-image. I think you may actually want to move the ‘add-new-image’ route out of the parent, something like this:

this.route('something', { path: 'something/:id' });
this.route('something.add-new-image', { path: 'something/add-new-image' });

#3

See, that’s what I figured, but then how else can I model the state of adding a new image or editing an image for that specific I’d so that people can send each other links to directly add or edit those images?


#4

Oh in that case… have you tried just changing your link-to to something like:

{{#link-to 'something.add-new-image' 1234}}

#5

Ok, so I tried what you said @dknutsen and that also refreshes the parent model. :confused:


#6

Hmmmmm that’s a weird one. Can you post more of your code? Like your routes and anything else that might be relevant from the router? Plus any actual code that does the link-to or any transitions?


#7

I found out that it was because i had a task running when didTransition when it hought that only happened when you came to the route, but it in fact fires when you go to a child route, which i find weird.


#8

Yeah it is weird. It’s kinda one of those Ember magic-y things. I just ran into basically the reverse issue with willTransition the other day, and I’d guess didTransition works the same way.

Basically the willTransition event will bubble if you return ‘true’ from a willTransition handler (and the default handlers return true, so it bubbles by default). In my case I wanted it to bubble to the application route and it was not because I was handling it in a child route and not returning ‘true’.

In your case it sounds like you don’t want it to bubble, so, assuming didTransition works the same way, you could handle the didTransition event at the level that you’d like and then return false (or don’t return anything) which may prevent it from bubbling.