Ensure that the directive works well alongside other route animations. It's possible it will be a problem because the animation does not play until the component is initialized in the new route.
We also need to make sure the directive excludes itself from any route animations.
This ended up being a problem for other reasons than I thought.
First of all, normal navigation between routes is difficult - especially if you can't easily use absolute position.
Also, excluding our animating element from the route animation is difficult. I ended up getting a POC by appending the element to a great, great, great grandparent before the animation, and moving it back when the animation is done. It caused other problems though. Such as elements that rely on our element for sizing (think flex) having the wrong size during the animation. It would be better to possibly make a copy (and make the original invisible). For this approach to work, I will also need a good way to know which ancestor to append the element to when animating.
Ensure that the directive works well alongside other route animations. It's possible it will be a problem because the animation does not play until the component is initialized in the new route.
We also need to make sure the directive excludes itself from any route animations.