Question

默认路由未加载选项卡组件为默认值。它只适用于我替换下面的代码

{ 路径：＆＃39; tab /：id＆＃39;， component：TabComponent选项卡 } //注意：仅适用于一个参数 app.routing.ts

const appRoutes: Routes = [

    {
        path: '',
        component: NavMenuComponent, // nav component
        children: [
            {
                path: '',
                redirectTo: 'tab/' ,
                pathMatch: 'full'
            },
            {
                path: 'tab/:id/:title', 
                component: TabComponent // tabs
            }
        ]
    },

];

manu.copnent.html

 <ul class="list-unstyled list" *ngFor='let tab of tabs'>
            <li><a [routerLink]="['/tab',tab.LinkTabID,tab.TabName]" class="anchorLink"><i class="icon-home scolor"></i><font color="white">{{tab.TabName}}</font></a></li>



        </ul>

Answer 1

您无法导航到不存在的路线，路线tab/也不存在，只有tab/1/foo（或您用于参数的任何值）。< / p>

如果您希望能够导航到tab/，则需要创建这样的路线

const appRoutes: Routes = [

    {
        path: '',
        component: NavMenuComponent, // nav component
        children: [
            {
                path: '',
                redirectTo: '/tab' ,
                pathMatch: 'full'
            },
            {
                path: 'tab', 
                component: TabComponent // tabs
            }
            {
                path: 'tab/:id/:title', 
                component: TabComponent // tabs
            }
        ]
    },

];

您应该知道，从tabs/导航到tabs/1/foo TabComponent会在导航时被销毁并重新创建 <{1}}到tabs/1/foo tabs/2/bar会被重复使用。

具有多个参数的默认路由正在加载组件

1 个答案: