How to delay router deactivation in Angular2?

Question

I have been playing with the Angular2 Router, to figure out some other issues.

I've came across something like that in Angular2 documentation:

deactivate(instruction: Instruction) : Promise
Removes the contents of this router's outlet and all descendant outlets

I am wondering how can I set delay, and use new class as a provider, so that all of the Router navigation has some delay (lets say 1s). I want to do it, so that I can have slide in slide out animation - If I would be able to delay Route deactivation, I can have both Routes (previous and next) visible at one time.

Looks like a dup of http://stackoverflow.com/questions/36234352/how-to-override-deactive-method-in-router/36234378#36234378 — Günter Zöchbauer, Mar 26 '16 at 20:57

score 2 · Answer 1 · edited Jan 19 '17 at 18:58

2

You can implement CanDeactivate but this is required on each component that is added/remove by the router. If you return a Promise that settles after 1s then the removal of the component is delayed this 1s.

I don't know if there is a more generic way like using a custom implementation (subclass) of the <router-outlet> or similar.

edited Jan 19 '17 at 18:58

oooyaya

1,773
1
15
39

answered Mar 26 '16 at 20:58

Günter Zöchbauer

623,577
216
2,003
1,567

I was playing with it, and it doesn't activate another state. I will provide plnkr soon. – uksz Mar 26 '16 at 21:02
There is a related open issues (couldn't find it just yet). There is also work in progress for better animations support https://github.com/angular/angular/pull/6768 – Günter Zöchbauer Mar 26 '16 at 21:06

How to delay router deactivation in Angular2?

1 Answers1