菜單中的Angular路由器鏈接無法打開新頁面

Question

在Angular 5應用程序中，我看到一個間歇性問題，我的菜單鏈接（路由器）無法打開新頁面。 相反，頁面會掉出視圖。 如果向下滾動，我可以看到同一頁是一個很大的空白區域。

URL確實會更改為新頁面，但不會呈現內容。

這是一段代碼：

<mat-list-item
    sideNavAccordion
    class="sidebar-list-item"
    role="listitem"
    *ngIf="!item.disabled && item.type !== 'separator' && item.type !== 'icon'"
    [ngClass]="{'has-submenu': item.type === 'dropDown'}"
    routerLinkActive="open">
      <a routerLink="/{{item.state}}" *ngIf="item.type === 'link'">
        <span
        class="menu-item-tooltip"
        [matTooltip]="item.tooltip"
        matTooltipPosition="right"></span>
        <mat-icon>{{item.icon}}</mat-icon>
        <span>{{item.name}}</span>
      </a>

...

app.routes.ts代碼段：

<!-- language: lang-ts -->

    export const rootRouterConfig: Routes = [
        {
            path: '',
            loadChildren: './views/home/home.module#HomeModule',
        },
        {
            path: '',
            component: AdminLayoutComponent,
            canActivate: [ AuthGuard ],
            children: [
                {
                    path: 'page1',
                    loadChildren: './views/test/test.module#TestModule',
                    data: { title: 'page 1', breadcrumb: 'page1'}
                },
        {
            path: 'page2',
            loadChildren: './views/manage/manage.module#ManageModule',
            data: { title: 'page 2', breadcrumb: 'page2'}
        },
    }
]

更新：我相信這是在登錄用戶的令牌過期時發生的。 僅在用戶通過身份驗證時才出現的菜單項出現，並且它們是（表明我認為）問題的菜單項。 您可能以為它們會像往常一樣工作，並且AuthGuard會將用戶定向到登錄頁面，但這似乎沒有發生。 我認為，如果我可以使菜單正確顯示，則不會發生此問題。

Answer 1

export const rootRouterConfig: Routes = [
    {
        path: '',
        loadChildren: './views/home/home.module#HomeModule',
    },
    {
        path: '',
        component: AdminLayoutComponent,
        canActivate: [ AuthGuard ],
        children: [
            {
                path: 'page1',
                loadChildren: './views/test/test.module#TestModule',
                data: { title: 'page 1', breadcrumb: 'page1'}
            },
            {
                path: 'page2',
                loadChildren: './views/manage/manage.module#ManageModule',
                data: { title: 'page 2', breadcrumb: 'page2'}
             }]
       }
]

app.routes.ts中的孩子有錯字]