petebacondarwin / ng1-component-router-demo

MIT License
30 stars 9 forks source link

navigate to parent route #5

Closed ArniDzhan closed 8 years ago

ArniDzhan commented 8 years ago

I have module component which has List and Record routes using respective components called list and record.

module.js

$routeConfig: [
    {
      path: '/list',
      component: 'list',
      name: 'List',
      useAsDefault: true
    },
    {
      path: '/record/:id/...',
      component: 'record',
      name: 'Record'
    }
  ]

/module/Installations/list/ /module/Installations/record/9c3dcf35-5da9-c7f2-a4e8-56bc516c6097/details

List just shows list of modules while Record shows a list of tabs for that module, default tab is Details which uses component details and shows module fields in a form, other tabs are related modules and I need to show them in a list so I figure I use the same list component to do that.

record.js

$routeConfig: [
    {path: '/details', name: 'DetailsTab', component: 'detailsComponent', useAsDefault: true},
    {path: '/:tab', name: 'ListTab', component: 'list'}
  ],

In a list component template I have links to Record, I want to use them and be able to navigate to Module/:moduleName/record/:id/details which worked fine using $router.navigate(['Record', { id: module.id }]) in list component controller while in /Module/List, but once it is in /Module/Record/ListTab the link stopped working throwing Component "Root" has no route config.

I am probably missing something obvious here, hoped maybe you can help out. thanks.

ArniDzhan commented 8 years ago

sorry to have a little discussion with myself here, anyway I found a way to solve my problem, not sure if it is the best way to do this, but passing this ['/Router/Module', { entity: module.name }, 'Record', { id: module.id }] to $router.navigate() did what I needed. (Router is a main route which is /pulse/ part of url)

hope that helps to anyone running into similar issue.