diff --git a/modules/store/src/store.ts b/modules/store/src/store.ts index 9de3f8f2e3..6677d84d0d 100644 --- a/modules/store/src/store.ts +++ b/modules/store/src/store.ts @@ -8,7 +8,8 @@ import { ReducerManager } from './reducer_manager'; import { StateObservable } from './state'; @Injectable() -export class Store extends Observable implements Observer { +export class Store extends Observable + implements Observer { constructor( state$: StateObservable, private actionsObserver: ActionsSubject, diff --git a/modules/store/testing/src/mock_store.ts b/modules/store/testing/src/mock_store.ts index f89062609a..8913d4b2cc 100644 --- a/modules/store/testing/src/mock_store.ts +++ b/modules/store/testing/src/mock_store.ts @@ -27,7 +27,7 @@ if (typeof afterEach === 'function') { } @Injectable() -export class MockStore extends Store { +export class MockStore extends Store { static selectors = new Map< | string | MemoizedSelector diff --git a/projects/ngrx.io/content/guide/store/selectors.md b/projects/ngrx.io/content/guide/store/selectors.md index dae4535814..0e6167dcee 100644 --- a/projects/ngrx.io/content/guide/store/selectors.md +++ b/projects/ngrx.io/content/guide/store/selectors.md @@ -240,6 +240,26 @@ selectTotal.release(); */ +## Using Store Without Type Generic + +When injecting `Store` into components and other injectables, it is possible to omit the generic type. If injected without the generic, the default generic is applied as follows `Store`. + +The most common way to select information from the store is to use a selector function defined with `createSelector`. When doing so, TypeScript is able to automatically infer types from the selector function, therefore reducing the need to define the type in the store generic. + +
+It is important to continue to provide a Store type generic if you are using the string version of selectors as types cannot be inferred automatically in those instances. +
+ +The follow example demonstrates the use of Store without providing a generic: + + +export class AppComponent { + counter$ = this.store.select(fromCounter.selectCounter); + + constructor(private readonly store: Store) {} +} + + ## Advanced Usage Selectors empower you to compose a [read model for your application state](https://docs.microsoft.com/en-us/azure/architecture/patterns/cqrs#solution).