angular
                                
                                 angular copied to clipboard
                                
                                    angular copied to clipboard
                            
                            
                            
                        animation leave not work
Environment
- NativeScript-Angular: 12.2.0
- Angular: 12.2.0
Describe the bug :leave or * => void not working
To Reproduce `import {animate, style, transition, trigger} from '@angular/animations';
export const fadeInOutAnimation = trigger('fadeInOut', [ // OK transition(':enter', [ style({opacity: 0}), animate('3s linear', style({opacity: 1})) ]), // KO transition(':leave', [ style({opacity: 1}), animate('3s linear', style({opacity: 0})) ]) ]);`
Expected behavior
Await before removing element from DOM
Here is a temporary trick:
Don't use ngIf. repalce it by hidden and a variable triggered by animation start and done
<GridLayout [@fadeInOut]="openCloseBooleanVar" (@fadeInOut.start)="isVisibleBooleanVar= true" (@fadeInOut.done)="isVisibleBooleanVar = openCloseBooleanVar" [hidden]="!isVisibleBooleanVar"></GridLayout>
then replace :enter and :leave by * => true and * => false
Really ugly solution but it works