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.

Establishing stateful data

Establishing stateful data - Angular Tutorial

From the course: Angular: Animations

Start my 1-month free trial

Establishing stateful data

“

- [Instructor] Most animations in Angular are driven through changes in a defined state from within the parent component, of the component instance about to be animated. The component instance, in this case, exists within our basic component view, and that is where we'll define our stateful data values. So here is the animbox component instance. It's in one column. This other column that we've had prepared is going to exist for some buttons we can click to actually change state. I'm going to paste in a snippet from our snippets file, and just perform some tabbing on there. So you can see here what we're doing is leveraging Bootstrap once again to create a button group. Within that button group are two links that are being styled as buttons, and the important bit when it comes to Angular animations are these right here. So we're using an Angular click, and invoking a function called set state. And then we pass in a string representative of the state we want. So I'm setting one state to…

Contents