Writing a reducer
NgRx states are immutable objects; we cannot modify their values through direct assignment, and the only way we can change their states is through reducers.
Reducers have different parts that we should implement, as follows:
- The interface or type that defines the properties of the state
- The arguments, which consist of the initial state and the current action
- The list of functions that handle that state changes based on the dispatched actions
We will create these reducer parts under the anti-heroes/state/anti-hero.reducers.ts
file.
The state interface
The state interface defines the shape of the state; this contains the properties or the slices of the state. In our application, we need a property that will hold the list of anti-heroes.
To implement the interface, we can use the following code:
export interface AntiHeroState { antiHeroes: ReadonlyArray<AntiHero>; }
The initial state
The next part...