Search⌘ K
AI Features

Plugging It All Together

Explore how to connect NgRx store with the root Angular module and update components to listen and dispatch actions directly. Understand updating the patient service to dispatch actions that modify the application state, enabling better state management in your projects.

Updating the Root module

Before you modify any components or services, you need to register ngrx and the reducer you created with the root module. Let’s open app.module.ts and make the following modifications:

TypeScript 3.3.4
import { StoreModule } from '@ngrx/store';
import { patientReducer } from './state';
@NgModule({
imports: [
BrowserModule,
ReactiveFormsModule,
StoreModule.forRoot({
})
],
... etc
})
  • Line 8: forRoot sets up the store object you’ve just used throughout the rest of the application. The argument defines store. Every key is a key of the store, as
...