Expert Angular

States

States are the defined animation property of an element at a given point of time.

States are our application's logical states, for example, active and inactive. We define the state name and the respective style properties for the state.

The general syntax for writing syntax to define states is as follows:

state('in', style({ backgroundColor: '#ffffcc'}))

In the preceding code syntax, we are defining the following:

1. We are defining a state by the name 'in', which is one of the logical states in our application.
2. In style, we define the CSS properties of the state that needs to be applied to the element. Regular CSS style attributes are defined here.