Add routing(id) vers page Details

src/app/components/card-plante/card-plante.component.html

@@ -1,7 +1,7 @@
-<div class="plant card mb-4" style="width: 14rem;">
+<div class="plant card mb-4" style="width: 14rem;" (click) = "onGetId(plant.product_id)">
-    <app-icon class="like" 
+    <app-icon class="like"
-            [iconName]="'heart'" 
+            [iconName]="'heart'"
-            [iconColor]="'#e35d6a'" 
+            [iconColor]="'#e35d6a'"
             (click)="onClickLike()"></app-icon>
     <img src="{{plant.product_url_picture}}" class="card-img-top" alt="Image de {{ plant.product_name }}">
     <div class="card-body">
@@ -9,7 +9,7 @@
         <div class="card-content">
             <app-avis-bar></app-avis-bar>
         </div>
-        
+
         <div class="d-flex flex-row align-items-end justify-content-between">
             <div class="card-content">
                 {{ plant.product_unitprice_ati }} €
@@ -17,4 +17,4 @@
             <a href="#" class="btn btn-success">Pour moi !</a>
         </div>
     </div>
-</div>
+</div>

src/app/components/card-plante/card-plante.component.ts

@@ -1,4 +1,5 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Router } from '@angular/router';
 
 
 @Component({
@@ -9,14 +10,21 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 export class CardPlanteComponent implements OnInit {
   @Input() plant: any;
   @Output() clickLike = new EventEmitter();
-  constructor() { }
+  @Output() clickCardId = new EventEmitter();
+
+  constructor(private router : Router) {}
 
   ngOnInit(): void {
   }
-
   onClickLike() {
     console.log('click');
     this.clickLike.emit();
   }
-
+  onGetId(id : string){
+    this.clickCardId.emit(id);
+    this.router.navigateByUrl('/details/'+ id);
+  }
 }
+
+
+//http://localhost:3000/list_products?product_id=952438

src/app/pages/page-details/page-details.component.html

@@ -1 +1,3 @@
-<p>page-details works!</p>
+<p (clickCardId) = "test($event)"></p>
+
+

src/app/pages/page-details/page-details.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 
+
 @Component({
   selector: 'app-page-details',
   templateUrl: './page-details.component.html',
@@ -7,9 +8,15 @@ import { Component, OnInit } from '@angular/core';
 })
 export class PageDetailsComponent implements OnInit {
 
-  constructor() { }
+ detailsPlant: any
+  constructor() {
+   }
 
   ngOnInit(): void {
+
   }
 
+  test(texte:any){
+  console.log(texte);
+  }
 }