Unable to navigate to the new page on icon click

Question

I am trying to navigate to the new page on click of the icon and the component is like below

getTabDetails() {
  switch (this.tabContent) {
    case 'Shipment content':
      {
        this.router.navigateByUrl('/ProjectShipment/000634');
      }
  }
}

And my Routing component is like below

const appRoutes: Routes = [
  {
  path: 'dB',
  data: { title: 'Dashboard' },
  children: [
      {
          path: 'ProjectShipment/:reportProject',
          component: ProjectShipmentComponent,
          data: { title: 'Project Shipment' },
      }

I get the below error when the icon is clicked

Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'ProjectShipment/000634' Error: Cannot match any routes. URL Segment: 'ProjectShipment/000634'

but when I try to access the page directly through URL it works

http://localhost:4200/dB/ProjectShipment/000634

Am I missing something here?

@PrashantPimpale Yes dB is the path. I have updated the question — trx, Aug 28 '19 at 11:14
Check accepted answer on:https://stackoverflow.com/questions/57473394/angular-how-to-navigate-to-child-route-from-parent-component-by-using-navigate/57473645#57473645 — Prashant Pimpale, Aug 28 '19 at 12:14

score 1 · Accepted Answer · answered Aug 28 '19 at 07:14

1

you can try:

this.router.navigateByUrl(['ProjectShipment',000634], relativeTo:this.route);

where

private route: ActivatedRoute

in case you are at /dB path

answered Aug 28 '19 at 07:14

tano

2,657
1
15
16

score 0 · Answer 2 · edited Aug 28 '19 at 07:06

0

self.router.navigate(['./ProjectShipment/000634']);

edited Aug 28 '19 at 07:06

barbsan

3,418
11
21
28

answered Aug 28 '19 at 06:46

Klienblat Moshe

322
1
6

Unable to navigate to the new page on icon click

2 Answers2