如何显示/隐藏另一个组件中的链接？

Question

我在Angular中具有以下主要组件app.component的结构：

<div class="links">
    <div class="link_1"></div>
    <div class="link_2"></div>
</div>
<router-outlet></router-outlet>

因此在<router-outlet></router-outlet>中，不同的组件被替换。

如果<div class="link_1"></div>内有组件作为实例<router-outlet></router-outlet>，如何隐藏EventComponent？

以及如何显示<div class="link_2"></div>是否是另一个组件，无论哪个。我想知道如何显示/隐藏上方的菜单元素取决于下方的当前组件。

我不想在每个组件中都将变量创建为public show = true;

Answer 1

尝试将路由器与路由器插座一起包括在组件中，然后查找与所选链接相对应的路径，例如

constructor(private _router: Router ) {}

get currentUrl() { return this._router.url; }

然后在您的模板中

<div *ngIf="currentUrl !== 'someUrl'" class="link_1"></div>