22. Use Entity Adapter
In this section, we will normalise our state into dictionaries to make it easier to manage, query and project our state. This is one of the most important steps to make better redux.
1. npm install @ngrx/entity
Entity State adapter for managing record collections. @ngrx/entity provides an API to manipulate and query entity collections.
Reduces boilerplate for creating reducers that manage a collection of models.
Provides performant CRUD operations for managing entity collections.
Extensible type-safe adapters for selecting entity information.
npm install the library
2. Make an entity adapter
make an adapter and use it to make the initial state and manage collections.
3. Update reducer to use entity adapter collection methods
The entity adapter will allow us to take a collection and manage it with a set of Adapter Collection Methods. The entity adapter also provides methods for operations against an entity. These methods can change one to many records at a time. Each method returns the newly modified state if changes were made and the same state if no changes were made. You can read more here https://github.com/ngrx/platform/blob/master/docs/entity/adapter.md.
Change out manual collection management for adapter collection methods.
Make selectors from the adapter with
adapter.getSelectors
method.
3. Update selectors
Update attendee selectors to use the new adapter getSelector methods.
StackBlitz Link
Last updated