Skip to content

Commit

Permalink
feat(RouterStore): make the router store key selector generic
Browse files Browse the repository at this point in the history
* feat(RouterStore): make the router store key selector generic
* docs: add note that router stateKey can also be a selector

Closes #1457
  • Loading branch information
timdeschryver authored and brandonroberts committed Dec 12, 2018
1 parent ab494b1 commit a30a514
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 7 deletions.
17 changes: 12 additions & 5 deletions modules/router-store/src/router_store_module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,12 +29,17 @@ import {
DefaultRouterStateSerializer,
RouterStateSerializer,
SerializedRouterStateSnapshot,
BaseRouterStoreState,
} from './serializer';

export type StateKeyOrSelector = string | Selector<any, RouterReducerState>;
export type StateKeyOrSelector<
T extends BaseRouterStoreState = SerializedRouterStateSnapshot
> = string | Selector<any, RouterReducerState<T>>;

export interface StoreRouterConfig {
stateKey?: StateKeyOrSelector;
export interface StoreRouterConfig<
T extends BaseRouterStoreState = SerializedRouterStateSnapshot
> {
stateKey?: StateKeyOrSelector<T>;
serializer?: new (...args: any[]) => RouterStateSerializer;
/**
* By default, ROUTER_NAVIGATION is dispatched before guards and resolvers run.
Expand Down Expand Up @@ -136,8 +141,10 @@ enum RouterTrigger {
],
})
export class StoreRouterConnectingModule {
static forRoot(
config: StoreRouterConfig = {}
static forRoot<
T extends BaseRouterStoreState = SerializedRouterStateSnapshot
>(
config: StoreRouterConfig<T> = {}
): ModuleWithProviders<StoreRouterConnectingModule> {
return {
ngModule: StoreRouterConnectingModule,
Expand Down
7 changes: 5 additions & 2 deletions projects/ngrx.io/content/guide/router-store/configuration.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@

```ts
interface StoreRouterConfig {
stateKey?: string;
stateKey?: string | Selector<any, RouterReducerState<T>>;
serializer?: new (...args: any[]) => RouterStateSerializer;
navigationActionTiming?: NavigationActionTiming;
}
```

- `stateKey`: The name of reducer key, defaults to `router`
- `stateKey`: The name of reducer key, defaults to `router`. It's also possible to provide a selector function.
- `serializer`: How a router snapshot is serialized. Defaults to `DefaultRouterStateSerializer`. See [Custom Router State Serializer](#custom-router-state-serializer) for more information.
- `navigationActionTiming`: When the `ROUTER_NAVIGATION` is dispatched. Defaults to `NavigationActionTiming.PreActivation`. See [Navigation Action Timing](#navigation-action-timing) for more information.

Expand All @@ -24,6 +24,7 @@ Your custom serializer should implement the abstract class `RouterStateSerialize
You then provide the serializer through the config.

**In a custom serializer ts file**

```ts
import { Params, RouterStateSnapshot } from '@angular/router';
import { RouterStateSerializer } from '@ngrx/router-store';
Expand Down Expand Up @@ -56,13 +57,15 @@ export class CustomSerializer implements RouterStateSerializer<RouterStateUrl> {
```

**In your root reducer**

```ts
export const reducers: ActionReducerMap<State> = {
router: routerReducer
};
```

**In your AppModule**

```ts
@NgModule({
imports: [
Expand Down

0 comments on commit a30a514

Please sign in to comment.