角路由嵌套组件不起作用

问题描述

我正在使用Angular 10应用程序，但是在使用惰性模块加载的路由中嵌套组件时遇到了一些问题。事情是这样的：

我的app.component有一个<router-outlet>，可以显示2个不同的组件，app-layout.component和auth-layout.component。仅当授权卫士授权时才显示应用程序组件。如果不是，那么它将显示未找到的路由（也用于“ **”路径）

布局具有许多HTML视图，这些视图提供了通过延迟加载来导航到另一个模块的选项。因此，app-layout和auth-layout也具有自己的<router-outlet>来显示模块。

每个模块都有其路由，但是目前它仅作为父级的唯一基础组件。

我需要显示account-config组件，放入<router-outlet>并在其中渲染其他组件（'couse account-config.component具有第二个导航栏）

此图像说明了我的需求

我尝试了很多方法来做，但是看来我做错了。

在堆叠闪电战中这是最小的复制品------- >>>> https://stackblitz.com/edit/angular-ivy-5nfvke?file=src/app/pages/modules/account-config/components/account-config/account-config.component.html

有什么办法解决这个问题？

解决方法

您需要从 pathMatch: 'full'的路径account-config中删除app-routing.module.ts