本文介绍了Angular 5路由:空路径内的空路径的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Angular 5,试图将空路径子路径加载到空路径父布局路径中。当我访问localhost:4200 / why-us时,FullLayoutComponent始终会加载,而WhyUsComponent组件会加载。

I'm using Angular 5, trying to load a empty-path child route into a empty-path parent layout route. The FullLayoutComponent always loads, and the WhyUsComponent component loads when I visit localhost:4200/why-us.

但是当我访问localhost:4200时,我无法让FrontpageComponent加载

But I cannot get the FrontpageComponent to load when I visit localhost:4200

如果我将FrontPageComponent的路径更改为front-page,则在访问localhost:4200 / front-page时将加载它。

If I change the path for FrontPageComponent to front-page, it will load when I visit localhost:4200/front-page.

似乎空父路径中的空子路径不起作用(我已经尝试过pathMatch btw的所有组合)

It seems like empty child path inside empty parent path doesn't work (i've tried all combinations of pathMatch btw)

我需要FrontpageComponent加载到我网站的根目录,没有任何定义的路径。

I need to the FrontpageComponent to load at the root of my site, without any defined path.

RouterModule.forRoot([
        {
            path: '',
            component: FullLayoutComponent,
            children: [
                {
                    path: '',
                    component: FrontpageComponent,
                    pathMatch: 'full',
                    data: {
                        meta: {
                            title: '',
                            description: ''
                        }
                    }
                },
                {
                    path: 'why-us', component: WhyUsComponent, pathMatch: 'full',
                    data: {
                        meta: {
                            title: 'Why Us?',
                            description: 'Why would you choose us? '
                        }
                    }
                }] // close children
       }
])


推荐答案

我设法找到了一种可行的方法,即延迟加载

I managed to find a way that works, lazy loading

RouterModule.forRoot([
        {
            path: '',
            component: FullLayoutComponent,
            loadChildren: 'path/to/my.module#MyModule'
}

在MyModule中,我定义了路由,包括带有空字符串。

and in MyModule, I have my routes defined, including the root path with an empty string.

这篇关于Angular 5路由:空路径内的空路径的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-12 17:25