From the course: Angular: Animations

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Animation input parameters

Animation input parameters - Angular Tutorial

From the course: Angular: Animations

Start my 1-month free trial

Animation input parameters

- [Instructor] As we saw in the previous lesson, reusable animations allow us to define an animation once and use it multiple times across our angular application. But what if we want to adjust the timing, delay, or other properties to adjust slightly for different circumstances. This is where input parameters will come into play. Let's pop over to our animations.ts file. And I'm going to replace our current fadeAnimation which as you can see here has all sorts of values predefined. I'll replace this with a modified version from our snippets file, which instead uses various input parameters for things like time, delay, to and from. And you can see that this works with just regular, angular data binding. Let's go ahead and save. So this prepares our reusable animation to accept input parameters. Now we have to go over to whatever's using this animation and set it up a little bit differently how it actually invokes useAnimation. So go back into fadeblock.component and let's actually…

Contents