slide div on click angular

1<div *ngIf="visible" [@slideInOut]>This element will slide up and down when the value of 'visible' changes from true to false and vice versa.</div>
2

1import { trigger, transition, animate, style } from '@angular/animations'
2
3@Component({
4  ...
5  animations: [
6    trigger('slideInOut', [
7      transition(':enter', [
8        style({transform: 'translateY(-100%)'}),
9        animate('200ms ease-in', style({transform: 'translateY(0%)'}))
10      ]),
11      transition(':leave', [
12        animate('200ms ease-in', style({transform: 'translateY(-100%)'}))
13      ])
14    ])
15  ]
16})
17