Multi-step Keyframes Animation

Similar to how CSS keyframes animations work, keyframes allow us to build an animation in multiple steps. In other words, it lets us sequence our style changes for each element. Since this method can be passed into the animate function, it can be combined with the previous lesson’s animation sequencing group and sequence functions, giving us even more control over the sequencing of our animations.

How it works

Angular animations uses the keyframes function to create multi-step animations. Angular executes each entry in the keyframes array based on their offset property one at a time, thereby enabling developers to create ...