router.animation.ts 692 Bytes
import {trigger, state, animate, style, transition} from '@angular/core';

// tslint:disable-next-line:typedef
export function routerTransition() {
  return trigger('routerTransition', [
    state('void', style({position: 'absolute', width: '100%', height: '100%', opacity: '1'}) ),
    state('*', style({position: 'absolute', width: '100%', height: '100%', opacity: '1'}) ),
    transition(':enter', [
      style({opacity: '0.5'}),
      animate('0.6s ease-in-out', style({opacity: '1'})),
    ]),
    transition(':leave', [
      style({transform: 'translateX(0%)', opacity: '1'}),
      animate('0.6s ease-in-out', style({transform: 'translateX(100%)', opacity: '0.5'})),
    ]),
  ]);
}