You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
RTL/src/app/shared/animation/route-animation.ts

18 lines
659 B
TypeScript

import { transition, trigger, query, style, animate, group } from '@angular/animations';
export const routeAnimation = trigger('routeAnimation', [
transition('* => *', [
query(':enter, :leave', style({ position: 'fixed', width: '100%' }), { optional: true }),
group([
query(':enter', [
style({ transform: 'translateX(100%)' }),
animate('1000ms ease-in-out', style({ transform: 'translateX(0%)' }))
], { optional: true }),
query(':leave', [
style({ transform: 'translateX(0%)' }),
animate('1000ms ease-in-out', style({ transform: 'translateX(-100%)' }))
], { optional: true })
])
])
]);