使用Angular登录后不显示路由

Question

我的应用程序应包含两个区域：admin（我们称之为iwti）和＆＃39; retaguarda＆＃39;，第二个区域已经正常工作，但是当我访问路由/iwti时<router-outlet>内部未出现。我删除了登录保护并直接访问路由并加载了没有布局部分。值得告知的是，我有一个用户替换的空闲计时器，但是当它将重定向到登录页面时，系统会显示一条路线：

Error "Can not find primary outlet to load 'LoginComponent'".

我不知道我是否正确地更改了这些区域，但我会将代码放下来。

app.routing.module.ts

export const rotasPrincipais: Routes = [
    { path: 'login', component: LoginComponent },
]

app.component.html

<app-iwti *ngIf="ambiente.isIWTIUserAuthentication">
</app-iwti>

<app-retaguarda *ngIf="!ambiente.isIWTIUserAuthentication">

    

iwti.routing.module.ts

const iwtiRoutes: Routes = [
    { path: 'iwti', component: IwtiDashboardComponent, canActivate: [LoginGuard] },
    { path: 'iwti/funcionario', component: IwtiFuncionarioComponent, canActivate: [LoginGuard] }
]

登录后，用户将被引导至router.navigate (['iwti'])。

iwti.component.html

<header>
    <div [hidden]="!ambiente.isAuthenticated">
        <app-iwtinavbar></app-iwtinavbar> <!--It appears normally when logged in-->
    </div>
</header>
<div class="container" [hidden]="!ambiente.isAuthenticated">
    <router-outlet></router-outlet> <!--I believe the problem is this, if I give a name to the outlet and refer to the file where I declare the route, it says it can not find a route with this name.-->
</div>

结构

Answer 1

您的app.component.html需要路由器插座 在进行路由的每个模块的主要组件中，您需要一个路由器插座。所以在你的情况下，它看起来像app.module和iwti.module都做路由。由于你的IWTI已经有了它知道在哪里渲染你的子路线，但你的app.module没有。

以下内容应解决您的问题，但您还需要确保路线设置正确。确保你的iwti-routing.module调用forChildren而不是forRoot。

将app.component.html更改为

<app-iwti *ngIf="ambiente.isIWTIUserAuthentication">
</app-iwti>

<app-retaguarda *ngIf="!ambiente.isIWTIUserAuthentication">
<router-outlet></router-outlet>