From 87193310a867c03b9e80ff91682cb914bcf6ce27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Patrick=20M=C3=BCller?= <patrick@mueller-patrick.tech>
Date: Thu, 3 Dec 2020 11:31:48 +0100
Subject: [PATCH] BETTERZON-41: Added routing for product detail pages

---
 Frontend/src/app/app.routing.ts               |  2 +-
 .../product-detail-page.component.html        |  2 +-
 .../product-detail-page.component.ts          | 20 ++++++++++++-------
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/Frontend/src/app/app.routing.ts b/Frontend/src/app/app.routing.ts
index f34925f..134bd56 100644
--- a/Frontend/src/app/app.routing.ts
+++ b/Frontend/src/app/app.routing.ts
@@ -8,7 +8,7 @@ import {ProductDetailPageComponent} from './product-detail-page/product-detail-p
 
 const routes: Routes = [
     {path: '', component: LandingpageComponent},
-    {path: 'product', component: ProductDetailPageComponent}
+    {path: 'product/:id', component: ProductDetailPageComponent}
 ];
 
 @NgModule({
diff --git a/Frontend/src/app/product-detail-page/product-detail-page.component.html b/Frontend/src/app/product-detail-page/product-detail-page.component.html
index b57e35b..e7a41e4 100644
--- a/Frontend/src/app/product-detail-page/product-detail-page.component.html
+++ b/Frontend/src/app/product-detail-page/product-detail-page.component.html
@@ -1 +1 @@
-<p>product-detail-page works!</p>
+<p>product-detail-page works! Product: {{productId}}</p>
diff --git a/Frontend/src/app/product-detail-page/product-detail-page.component.ts b/Frontend/src/app/product-detail-page/product-detail-page.component.ts
index 12a47aa..c59a734 100644
--- a/Frontend/src/app/product-detail-page/product-detail-page.component.ts
+++ b/Frontend/src/app/product-detail-page/product-detail-page.component.ts
@@ -1,15 +1,21 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
+import {Router} from '@angular/router';
 
 @Component({
-  selector: 'app-product-detail-page',
-  templateUrl: './product-detail-page.component.html',
-  styleUrls: ['./product-detail-page.component.css']
+    selector: 'app-product-detail-page',
+    templateUrl: './product-detail-page.component.html',
+    styleUrls: ['./product-detail-page.component.css']
 })
 export class ProductDetailPageComponent implements OnInit {
+    productId: string;
 
-  constructor() { }
+    constructor(
+        private router: Router
+    ) {
+        this.productId = router.url.substr(9, router.url.length);
+    }
 
-  ngOnInit(): void {
-  }
+    ngOnInit(): void {
+    }
 
 }