Angular 4隐藏某些页面上的下拉列表

Question

我想隐藏某个页面上的Dropdown（包括它的元素）。我会用'* ngIf＆＃39; - 请求来做，但是我不确定这个条件。 路由器路径是＆＃39; / project＆＃39;但我无法访问它 - 因此* ngIf =＆＃34; path ===＆＃39; / project＆＃39;＆＃34;不会工作。 应该使用什么条件的想法？或者是解决问题的更好方法。

还有像/ project / id这样的子路径，下拉列表应该可用。

Answer 1

在你的控制器中，添加一个可见的布尔值（true或false） 并在你的HTML中简单地添加：* ngIf =“可见”到您的div

Answer 2

在您的组件/控制器中，尝试类似：

showDropdown: boolean = false;

ngOnInit() {
      this.showDropdown = path === '/project'
}

路径可能是组件的输入变量吗？

@Input
path: string;

在HTML模板中，您可以执行以下操作：

<div *ngIf="showDropdown">test</div>

Answer 3

据我了解您的情况，您需要执行以下操作：

• 1. 在导航栏组件中，您必须订阅路由以获取当前路径，以帮助您了解是否显示您的下拉列表，请执行以下操作

  import { Router, NavigationEnd } from '@angular/router'; public showDropDown: boolean; constructor(private router: Router) {} ... ngOnInit() { this.router.events.subscribe(event => { if (event instanceof NavigationEnd) { this.showDropdown = event.url.indexOf('/project') >= 0; } } }

  2. 1. 在您的下拉列表中的html

     <div class="my-dropdown" *ngIf="showDropdown"> ... (your dropdown) </div>

这将帮助您避免来自其他组件的依赖性，并能够根据路由操作数据。当然总有办法改善这一点。一切都取决于你想要的结果。