14

I am using angular Animations with version 4.1.3

Here is the below code:

@Component({
  selector : 'my-fader',
  animations: [
    trigger('visibilityChanged', [
      state('true' , style({ opacity: 1, transform: 'scale(1.0)' })),
      state('false', style({ opacity: 0, transform: 'scale(0.0)'  })),
      transition('1 => 0', animate('300ms')),
      transition('0 => 1', animate('900ms'))
    ])
  ]
...

Now, instead of style in state I would like to give existing class name i.e using the class defined in style sheets (i.e Not inline styles)

Is that possible? If so please help.

Z. Bagley
  • 8,942
  • 1
  • 40
  • 52
sudhir
  • 1,387
  • 3
  • 25
  • 43

1 Answers1

8

You can't. I was also looking for a similar solution.

Angular Animations use the Web Animations API and not CSS.

See https://css-tricks.com/css-animations-vs-web-animations-api/ for further reading.

user1059939
  • 1,613
  • 2
  • 20
  • 37