Using a Different Animation based on a Buttonclick

Ionic Framework ionic-v3
1

Since I can’t use document.getElementById.setAttribute('animation', 'animation1 2s fade') in angular and Ionic, I need a way to perform one out of 5 animations based on information from Javascript. For example, if a user presses one out of the five buttons in the DOM, I want one out of the 5 different animations for an image to be launched for CSS.

As of right now, my solution is to have two views. One has an *ngIf condition which evaluates to true and then launches an animation. However, I can’t seem to find a way to pick a specific animation when this evaluates to true.

I just really want to get around having 5 different sections with five different *ngIf statements since this will crowd my HTML a lot and ruin memory etc.

2

Binding [animation] doesn’t work?

4

“Animation isn’t a known attribute of img”. What to do ?

5

Use ngClass and css. If you are familiar with css animations then you can handle this very easy

1 Like
6

@sergi95 This is the easiest solution. Thanks a lot!