Angular 7 animation for router works only once

Question

I added an animation effects for navigation between pages, but it works only once. On start-up, and then it doesnt work any more.

Here is an animation logic:

import {
    trigger,
    transition,
    style,
    query,
    group,
    animateChild,
    animate,
    keyframes,
  } from '@angular/animations';

  export const slider =
  trigger('routeAnimations', [
    transition('* => isLeft', slideTo('left') ),
    transition('* => isRight', slideTo('right') ),
    transition('isRight => *', slideTo('left') ),
    transition('isLeft => *', slideTo('right') )
  ]);

function slideTo(direction) {
  const optional = { optional: true };
  return [
    query(':enter, :leave', [
      style({
        position: 'absolute',
        top: 0,
        [direction]: 0,
        width: '100%'
      })
    ], optional),
    query(':enter', [
      style({ [direction]: '-100%'})
    ]),
    group([
      query(':leave', [
        animate('600ms ease', style({ [direction]: '100%'}))
      ], optional),
      query(':enter', [
        animate('600ms ease', style({ [direction]: '0%'}))
      ])
    ]),
    // Normalize the page style... Might not be necessary

    // Required only if you have child animations on the page
    // query(':leave', animateChild()),
    // query(':enter', animateChild()),
  ];
}

Here is a navbar HTML part

<div [@routeAnimations]="prepareRoute(outlet)" class="container-fluid">
  <router-outlet #outlet="outlet">
  </router-outlet>
</div>

Here is a navbar TS part

  prepareRoute(outlet) {
    return outlet && outlet.activatedRouteData && outlet.activatedRouteData['animation']
  }

Here is router config

export const routes: Routes = [
  { path: "",        component: UserloginComponent, data: { animation: 'isRight' } },
  { path: "dashboard", component: NavbarComponent, data: { animation: 'isRight' }, children: [

  /* MAIN ROUTES */
  { path: "forms",    component: DynamicFormComponent, canActivate: [], data: { animation: 'isRight' } }, 
  { path: "table",    component: DynamicTableComponent, canActivate: [], data: { animation: 'isRight' }  }, 

  /* Auth and conf routes */
  { path: "",             component: IndexComponent },
  { path: "appinfo",      component: AppinfoComponent, canActivate: [] },
  { path: "register",     component: UserregisterComponent },
  { path: "recover",      component: PasswordrecoverComponent },

  { path: "user",         component: UserprofileComponent, canActivate: [] },
  { path: "**",           component: NotfoundComponent },
]}]

Thats all. It happens not only with this curret slider. I tried different functions, but it has the same behavior - it shows a first animation on the start-up and then nothing. Edit: No errors are shown in the console.

An app uses a version of "@angular/animations": "7.2.15"