时间戳

首页 > 解决方案 > 如何以角度隐藏特定组件的 div？

angular - 如何以角度隐藏特定组件的 div？

问题描述

我是角度的新手。

在我的应用程序组件 html

我有

<div class="A">
<router-outlet ></router-outlet>
</div>

加载的任何组件都将在 div 内。

我可以从中删除登录组件吗？

我试过这个动作如何在角度2中为登录组件使用单独的布局？ 它不工作？

标签： angular

解决方案

router-outlet负责根据当前路由渲染路由器实例化的组件。

如果您希望组件不在此位置呈现并且依赖于匹配的路由，例如您的LoginComponent，您可以将它从您的路由配置中删除（通常是 at/src/app/app-routing.module.ts或类似名称）。

虽然这尽可能地回答了您的问题，但考虑到您的详细信息，我建议您仍然希望LoginComponent在模板中包含 ，具体取决于您的路线。您可以通过以下方式实现此目的

  • 将其放置在例如根目录中的某个位置并app.component.html结合 anngIf以确保它仅在特定路由<app-login *ngIf="isInLogin()"></app-login>上触发：，并订阅 url 更改或检查ts文件中的位置 url
  • 创建第二个router-outlet。要使多个router-outlets 在一个应用程序中工作，您应该使用该name属性，请参阅文档
  • 添加一个ngIf到 div 本身，假设您无论如何都希望有一个服务来管理身份验证：<div *ngIf="!authenticationService.isLoggedIn()">

推荐阅读