Skip to content

Wrong component destroying order #3552

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
i23591326 opened this issue Oct 19, 2017 · 4 comments
Closed

Wrong component destroying order #3552

i23591326 opened this issue Oct 19, 2017 · 4 comments
Labels

Comments

@i23591326
Copy link

I have a nested route chain /object/object123/controller/controller456/contrdeviceparam

when i navigate
/object/object123/controller/controller456/contrdeviceparam => /object/object123/controller/controller456
contrdeviceparam's component being destroyed and it triggers $onDestroy event whitch triggers component's onDestroyCallback "&" binding that is processed outside in corresponding router's resolve.

However, when i go
/object/object123/controller/controller456/contrdeviceparam => /object/object123
three components is being destroyed, but order of callbacks is:
controller=>controller456=>contrdeviceparam instead of opposite, i.e. parent component being destroyed earlier then it's child (???), and it breaks internal logic.

By the way i checked router's onEnter/onExit events and they are fires properly (contrdeviceparam =>controller456=>controller), but I had to abandon the use of this approach
because of the too long gap between onExit and onEnter

@christopherthielen
Copy link
Contributor

@i23591326
Copy link
Author

home => home.foo.bar => home:

Transition #6-0: Started -> "Transition#6( 'home'{} -> 'home.foo.bar'{} )"
trace.ts:207 Transition #6-0: <- Success "Transition#6( 'home'{} -> 'home.foo.bar'{} )", final state: home.foo.bar
_main.js:34 onInit foo
_main.js:34 onInit bar
trace.ts:162 Transition #7-0: Started -> "Transition#7( 'home.foo.bar'{} -> 'home'{} )"
trace.ts:207 Transition #7-0: <- Success "Transition#7( 'home.foo.bar'{} -> 'home'{} )", final state: home
_main.js:35 onDestroy foo
_main.js:35 onDestroy bar

http://plnkr.co/edit/geKdD7IpUR2xsPtNhrcI?p=preview

i suppose bar must be destroyed before foo

@christopherthielen
Copy link
Contributor

christopherthielen commented Dec 28, 2017

Hmmm... I'm not sure there's anything that ui-router can do about this. I wrapped the ui-views inside an ng-if and it has the same destroy order. I guess I'm not sure what guarantees angularjs provides for component destroy order. Can you do some more research on this?

Here's a forked plunker that shows the nested destroy happens in the same order when destroyed using ng-if: http://plnkr.co/edit/HbU3X2Qm4UUBsrBgdh6m?p=preview

_main.js:40 $onInit home
_main.js:40 $onInit foo
_main.js:40 $onInit bar
_main.js:43 $onDestroy home
_main.js:36 $scope.$on($destroy) home
_main.js:43 $onDestroy foo
_main.js:36 $scope.$on($destroy) foo
_main.js:43 $onDestroy bar
_main.js:36 $scope.$on($destroy) bar

@stale
Copy link

stale bot commented Jan 24, 2020

This issue has been automatically marked as stale because it has not had
recent activity. It will be closed if no further activity occurs.

This does not mean that the issue is invalid. Valid issues
may be reopened.

Thank you for your contributions.

@stale stale bot added the stale label Jan 24, 2020
@stale stale bot closed this as completed Feb 7, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants