feat(router-store): add route fragment selector (#2543)

Author: blove

modules/router-store/spec/router_selectors.spec.ts

@@ -69,6 +69,7 @@ const mockData = {
               ref: 'ngrx.io',
             },
           },
+          fragment: 'test-fragment',
           children: [],
         },
         fragment: null,
@@ -141,6 +142,14 @@ describe('Router State Selectors', () => {
       expect(result).toEqual(undefined);
     });
 
+    it('should create a selector for selecting the fragment', () => {
+      const result = selectors.selectFragment(state);
+
+      expect(result).toEqual(
+        state.router.state.root.firstChild.firstChild.fragment
+      );
+    });
+
     it('should create a selector for selecting the query params', () => {
       const result = selectors.selectQueryParams(state);
 

modules/router-store/src/models.ts

@@ -3,6 +3,7 @@ import { MemoizedSelector } from '@ngrx/store';
 
 export interface RouterStateSelectors<V> {
   selectCurrentRoute: MemoizedSelector<V, any>;
+  selectFragment: MemoizedSelector<V, string | undefined>;
   selectQueryParams: MemoizedSelector<V, Params>;
   selectQueryParam: (param: string) => MemoizedSelector<V, string | undefined>;
   selectRouteParams: MemoizedSelector<V, Params>;

modules/router-store/src/router_selectors.ts

@@ -22,6 +22,10 @@ export function getSelectors<V>(
     }
     return route;
   });
+  const selectFragment = createSelector(
+    selectCurrentRoute,
+    route => route && route.fragment
+  );
   const selectQueryParams = createSelector(
     selectCurrentRoute,
     route => route && route.queryParams
@@ -45,6 +49,7 @@ export function getSelectors<V>(
 
   return {
     selectCurrentRoute,
+    selectFragment,
     selectQueryParams,
     selectQueryParam,
     selectRouteParams,

projects/ngrx.io/content/guide/router-store/selectors.md

@@ -26,6 +26,7 @@ export const selectRouter = createFeatureSelector<
 
 export const {
   selectCurrentRoute,   // select the current route
+  selectFragment,       // select the current route fragment
   selectQueryParams,    // select the current route query params
   selectQueryParam,     // factory function to select a query param
   selectRouteParams,    // select the current route params