feat: provide matched path in route component (#38)

angular-component · Aug 1, 2020 · da7daed · da7daed
1 parent be07d16
commit da7daed
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 3 deletions.
diff --git a/libs/angular-routing/src/lib/route-params.service.ts b/libs/angular-routing/src/lib/route-params.service.ts
@@ -4,6 +4,8 @@ export interface Params {
   [param: string]: any;
 }
 
+export class RoutePath<T extends string = string> extends Observable<T> {}
+
 export class RouteParams<T extends Params = Params> extends Observable<T> {}
 
 export class QueryParams<T extends Params = Params> extends Observable<T> {}
diff --git a/libs/angular-routing/src/lib/route.component.ts b/libs/angular-routing/src/lib/route.component.ts
@@ -24,14 +24,18 @@ import {
 } from 'rxjs/operators';
 
 import { Load, Route, RouteOptions } from './route';
-import { Params, RouteParams } from './route-params.service';
+import { Params, RouteParams, RoutePath } from './route-params.service';
 import { RouterComponent } from './router.component';
 import { Router } from './router.service';
 
 export function getRouteParams(routeComponent: RouteComponent) {
   return routeComponent.routeParams$;
 }
 
+export function getRoutePath(routeComponent: RouteComponent) {
+  return routeComponent.routePath$;
+}
+
 @Component({
   // tslint:disable-next-line:component-selector
   selector: 'route',
@@ -47,17 +51,25 @@ export function getRouteParams(routeComponent: RouteComponent) {
       useFactory: getRouteParams,
       deps: [[new Self(), RouteComponent]],
     },
+    {
+      provide: RoutePath,
+      useFactory: getRoutePath,
+      deps: [[new Self(), RouteComponent]],
+    },
   ],
 })
 export class RouteComponent implements OnInit, OnDestroy {
   @ContentChild(TemplateRef) template: TemplateRef<any> | null;
+
   @Input()
   get path() {
     return this._path;
   }
+
   set path(value: string) {
     this._path = this.sanitizePath(value);
   }
+
   @Input() component: Type<any>;
   @Input() load: Load;
   @Input() reuse = true;
@@ -68,10 +80,12 @@ export class RouteComponent implements OnInit, OnDestroy {
   private _path: string;
   private destroy$ = new Subject();
   private _routeParams$ = new BehaviorSubject<Params>({});
+  private _routePath$ = new BehaviorSubject<string>('');
   private _shouldRender$ = new BehaviorSubject<boolean>(false);
 
   readonly shouldRender$ = this._shouldRender$.asObservable();
   readonly routeParams$ = this._routeParams$.pipe(takeUntil(this.destroy$));
+  readonly routePath$ = this._routePath$.pipe(takeUntil(this.destroy$));
   route!: Route;
 
   constructor(
@@ -97,6 +111,7 @@ export class RouteComponent implements OnInit, OnDestroy {
       mergeMap(([current, rendered]) => {
         if (current.route === this.route) {
           this._routeParams$.next(current.params);
+          this._routePath$.next(current.path);
 
           if (this.redirectTo) {
             this.router.go(this.redirectTo);

diff --git a/libs/angular-routing/src/lib/route.ts b/libs/angular-routing/src/lib/route.ts
@@ -19,6 +19,7 @@ export interface RouteOptions {
 export interface ActiveRoute {
   route: Route;
   params: Params;
+  path: string;
 }
 
 export interface ModuleWithRoute {

diff --git a/libs/angular-routing/src/lib/router.component.ts b/libs/angular-routing/src/lib/router.component.ts
@@ -73,7 +73,7 @@ export class RouterComponent implements OnInit, OnDestroy {
           }
 
           if (!routeToRender) {
-            this.setActiveRoute({ route: null, params: {} });
+            this.setActiveRoute({ route: null, params: {}, path: '' });
           }
         }),
         takeUntil(this.destroy$)
@@ -98,7 +98,8 @@ export class RouterComponent implements OnInit, OnDestroy {
     this.basePath = route.path;
 
     const routeParams: Params = pathInfo ? pathInfo.params : {};
-    this.setActiveRoute({ route, params: routeParams || {} });
+    const path: string = pathInfo ? pathInfo.path : '';
+    this.setActiveRoute({ route, params: routeParams || {}, path });
   }
 
   registerRoute(route: Route) {