How to route to child component of a named router outlet


#1

my routing module is,
const appRoutes : Routes = [
{ path : ‘main’, component : MainpageComponent,pathMatch:‘full’},
{ path : ‘main’, component : MainpageComponent,
children:[
{ path : ‘two’, component :Chart2Component,pathMatch:‘full’},
{ path : ‘two’, component :Chart2Component,
children:[
{ path : ‘chart_browse’,outlet :‘chart2_1’,
component:Chart2Browse1Component,pathMatch:‘full’},
{ path : ‘chart_browse’,outlet :‘chart2_1’, component :Chart2Browse1Component,
children:[
{ path : ‘vertical_bar’,component :VerticalBarchartComponent,pathMatch:‘full’},
]},
]},
]}

i need to route to VerticalBarchartComponent, for that i use ,
this.router.navigate([’/main/two/chart_browse/vertical_bar’]);
but i got error ,
ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'main/two' Error: Cannot match any routes. URL Segment: 'main/two' at ApplyRedirects.noMatchError (router.js:1765)

so how to solve the problem ?
when i type manually in URL
http://localhost:4200/main/two/(chart2_1:chart_browse/vertical_bar)

it works,but i not possible to navigate this url
so any sugggetion ?