i'm trying create animation on toast message in/out ngfor.
when new toasts come, animation ok, if click close 1 of them, toast messages removed dom, still in model , when new toasts come, not showing in dom.
in view have:
<div *ngfor="let message of messages; let idx = index;" class="toast" @flyinout="'in'" (click)="closetoast($event, idx)"> <div class="text {{message.type}}">{{message.text}}</div> </div>
and animation definition in component:
animations: [ trigger('flyinout', [ state('in', style({transform: 'translatex(0)'})), transition('void => in', [ style({transform: 'translatex(-100%)'}), animate(1000) ]), transition('in => void', [ animate(1000, style({transform: 'translatex(100%)'})) ]) ]) ]
how can wire trigger animation model? (using ng2 - rc3)
Comments
Post a Comment