Error: Cannot match any routes. URL Segment: 'home' Error: Cannot match any routes. URL Segment: 'home'

0
votes

My app module router module:

RouterModule.forRoot([
{path: 'home' , component: HomeComponent},
{path:'edit/:id', component:EditComponent},
{path: 'messages' , component: MessageComponent},
{path: '', redirectTo:'home',pathMatch:'full'},
])

My second module:

RouterModule.forChild
([
{
path:'first',
component:FirstComponent,
outlet:'admin'
},
{
path:"second",
component:SecondComponent
},
{
path:"admin",
component:AdminComponent,
outlet:'admin'
}
])

My app.component.html:

<div >
  <router-outlet>
      <div class="col-md-offset-3 col-md-1">
           <router-outlet name="admin"></router-outlet>
      </div>
  </router-outlet>
</div>

So whenever I use router inside my .ts file like this one,everything works fine,

this.router.navigate([{outlets: { admin: ['admin']}}]);

but when i try to use it inside my html with routerLink like this one:

<a [routerLink]="[{outlets: { admin: ['admin']}}]">routr</a>

I am getting error "Cannot match any routes. URL Segment: 'home'". I am using newest version of angular cli, and I have <base href="/"> inside my <head> tag. Any solution for this?

1
angulartypescriptangular-cliangular-routing

1 Answers

1
votes

I think you should add HomeComponent to your RouterModule.forChild as following 

RouterModule.forChild
([
{
path:'',
redirectTo: '/home',
pathMatch: 'full'
}
])

Also in your module.ts change to this:

@NgModule({ imports: RouterModule.forRoot(forChild)

Where forChild is an export const