角4路由添加一個組件而不是替換它

Question

我在動態加載的子模塊中配置了以下路由。
我不認為動態加載會引起問題，但可能是-所以我將其包括在內以供參考。

動態負荷

children: [
    {
        path: "dashboard",
        loadChildren: () => new Promise(resolve => {
            (require as any).ensure([],
                require => {
                    resolve(require("./dashboard/dashboard.module").DashboardModule);
                },
                "dashboard");
        })
    },

儀表板的路由模塊

const routes: Routes = [
    {
        path: "",
        component: ClearingDashboardComponent,
        data: {
            title: "Dashboard"
        }
    },
    {
        path: "logs",
        component: LogDisplayComponent,
        data: {
            title: "Logs"
        }
    }
];

登陸HTML如下所示

使用導航到LogDisplayComponent時

const ne: NavigationExtras = {
    queryParams: { ... }
};
this.router.navigate(["dashboard/logs"], ne);

在HTML上方添加了一個新組件。
當然每個組件都應該替換內部HTML嗎？

LogDisplayComponent在ClearingDashboardComponent上方，當我單擊時，每次我以任何一種方式導航時都會添加一個新組件？

如何修復替換部件而不是添加新部件的路線？

我正在使用角4.4.4 ...

Answer 1

嘗試將您的版本更新到5+。 Angular團隊已經解決了這個問題。 有關更多信息，請檢查以下鏈接：

https://github.com/angular/angular/issues/17261

https://github.com/angular/angular/issues/13725