-1
export const slideInAnimation = trigger("routeAnimations", [
    transition("1 <=> 2", [
        style({ position: "relative" }),
        query(":enter, :leave", [
            style({
                    position: "absolute",
                    top: 0,
                    left: 0,
                    width: "100%"
                  })
               ]),
        query(":enter", [style({ left: "-100%" })]),
        query(":leave", animateChild()),
        group([
               query(":leave", [animate("300ms ease-out", style({ left: "100%" }))]),
               query(":enter", [animate("300ms ease-out", style({ left: "0%" }))])
              ]),
        query(":enter", animateChild())
       ])
]);

Can any One tell me what I am doing wrong? I literally just copy pasted this from docs it looks so only rout animation is not working rest animation that uses state works just fine this rout I even tried <=> in the trigger but no use the animation just won't work

 prepareRoute(outlet: RouterOutlet) {
                                    return outlet.activatedRouteData["animation"];
                                    }
Moshe Slavin
  • 5,127
  • 5
  • 23
  • 38
Fahim Khan
  • 11
  • 1
  • 6
  • Welcome to stackoverflow! Are you referring to the docs here: https://angular.io/guide/route-animations? Do you have routes with the names "1" and "2" defined? (Similar to the "HomePage" and "AboutPage" in the example? – DeborahK Dec 29 '18 at 00:40

1 Answers1

0

i got it to work the animation was not getting triggered cause of child routs as when we navigate from parent route to child rout the :entry and :leave states are note loaded that is what i understood from a Medium post

Fahim Khan
  • 11
  • 1
  • 6