Question

我有一个带有主容器组件和侧栏的Angular应用程序。父组件包含两者。主容器也是其余组件的唯一路由器输出。

侧边栏模板在sessionStorage中查找特定密钥，如果密钥不在那里，它会从DOM中删除自己。我正在使用ngOnInit检查sessionStorage和*ngIf来显示/隐藏组件。

如果密钥不在sessionStorage中，则侧边栏会隐藏自身并且用户被重定向到/login，哪个组件显示在主容器组件上。当用户成功登录时，密钥在sessionStorage中设置，用户被重定向到'/'（在主容器上为登录用户加载初始屏幕），但侧边栏保持不变隐藏/移除。

如何让侧边栏再次显示？我是否需要触发事件，和/或通过父组件动态再次添加组件？

谢谢。

Answer 1

在app.component.ts中，您可以订阅路由器事件来执行此操作，例如。

import { OnInit } from '@angular/core';
import { Router } from '@angular/router';

export class AppComponent implements OnInit {
    constructor(private router: Router) { }

    ngOnInit(): void {
        this.router.events.subscribe(() => {
            this.showSidebar = // check if it exists
        });
    }
}

Angular 2在登录后显示由ngIf隐藏的侧边栏

1 个答案: