默认路由不在角度5中工作

时间:2018-01-13 06:05:18

标签: javascript angular angular2-routing angular-routing angular5

我设置了如下的延迟路由,

const appRoutes : Routes = [
{ path : '' , redirectTo : '/posts' , pathMatch:'full' },    
{ path : 'posts',  component:PostsComponent ,  children: [
    {path : 'contact' , component : ContactComponent },
    {path : ':slugurl' , component : SinglepostComponent }, 
    {path : 'category/:category' , component : PostfeedComponent },   
    {path : '' , component : PostfeedComponent },             
]},
{ path : 'about', loadChildren : './aboutme/aboutme.module#AboutmeModule' },    
{ path : 'admin',  loadChildren: './admin/admin.module#AdminModule' , canActivate: [ AuthGuard ] },  
{ path : 'login', loadChildren : './login/login.module#LoginModule' },]

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

但是它总是重定向到about path,正如你所看到的那样,我已经给出了发布的默认路由。请让我知道应该在哪里进行修正以使其正常工作。

1 个答案:

答案 0 :(得分:4)

尝试:

export const appRoutes : Routes = [
    { path : '' , redirectTo : '/posts' , pathMatch:'full' },    
    { path : 'posts',  component:PostsComponent ,  children: [
        {path : 'contact' , component : ContactComponent },
        {path : ':slugurl' , component : SinglepostComponent }, 
        {path : 'category/:category' , component : PostfeedComponent },   
        {path : '' , component : PostfeedComponent },             
    ]},
    { path : 'about', loadChildren : './aboutme/aboutme.module#AboutmeModule' },    
    { path : 'admin',  loadChildren: './admin/admin.module#AdminModule' , canActivate: [ AuthGuard ] },  
    { path : 'login', loadChildren : './login/login.module#LoginModule' },]

@NgModule({
   imports: [
     RouterModule.forRoot(appRoutes)
   ],
   exports: [RouterModule]
})
export class AppRoutingModule { }

然后在app.module.ts中导入AppRoutingModule。

每个Lazy Loaded模块都需要自己的routes.ts文件。