how to create a shared angular animation code example

Example: angular shared animation

//Create an animation.ts file:
import { trigger, state, style, transition, animate } from '@angular/core';

export const slideIn = trigger('slideIn', [
  ...the animation...
  ]);

//In the component.ts
import { slideIn } from './animations'; // path to your animations.ts file

@Component({
    selector: 'test-animation',
    templateUrl: './testAnimation.html',
    animations: [
      slideIn
    ]
})
export class TestAnimation implements OnInit {
    slideInState = 'in';
    ...
}