简体   繁体   中英

Input Animation when value changes Angular 2+

Hello im new with angular animations, i want to make my input animated when input value changes (is a calculator). I have done this, how can shoot an event to execute the animation?

@Component({
    selector: 'xxxxx',
    templateUrl: './yyyy.html',
    styleUrls: ['./example.scss'],
    animations: [
        trigger('simpleFadeAnimation', [
            state('in', style({opacity: 1})),
            transition(':enter', [
                style({opacity: 0}),
                animate(600)
            ])
        ])
    ]
})

you can use wild cards

animations: [
        trigger('simpleFadeAnimation', [
            transition('*=>*', [
                style({opacity: 0}),
                animate(600)
            ])
        ])
    ]

So, you can use

<div [@simpleFadeAnimation]="value">
.....some...
</div>

Each time you change the variable "value", the animation begings

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM