navigate via js

Author: abhishekrathore

src/app/cart/cart.component.html

@@ -16,7 +16,9 @@ <h1 class="grey">{{componentName}}</h1>
         *ngFor="let it of cart; let i=index"
         [ngStyle]="{'background':i%2 ? bg:''}"
         [ngClass]="{'list-group-item-danger':!(i%2)}"
-        routerLink="/product/{{it.name}}">
+        (click)="gotoProduct(it.name)">
+        <!-- routerLink="/product/{{it.name}}"> -->
+
            {{i+1}}. {{it.name | shorten: 4 | uppercase}} ({{it.time | date : 'dd/MMM'}})
         </li>
     </ul>

src/app/cart/cart.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, OnInit,EventEmitter, Output, OnChanges } from '@angular/core';
+import { Router } from '@angular/router';
 import { DataService } from '../data.service';
 
 @Component({
@@ -16,7 +17,7 @@ export class CartComponent implements OnInit, OnChanges {
   @Output() cartEvent = new EventEmitter()
 
 
-  constructor( private dService: DataService) {
+  constructor( private dService: DataService, private router: Router) {
     console.log(this.constructor.name)
 
     setTimeout(()=>{
@@ -41,6 +42,10 @@ export class CartComponent implements OnInit, OnChanges {
   //   console.log(e.target.value);
   // }
 
+  gotoProduct(item:string){
+    this.router.navigate(['product',item])
+  }
+
   addToCart(){
    this.cart.push({name:this.item, time:new Date()});
    this.item= ''