时间戳

首页 > 解决方案 > 如何根据用户名授予对 HTML 元素的访问权限？

html - 如何根据用户名授予对 HTML 元素的访问权限？

问题描述

我有一个按钮，如果他登录到网站，我需要向特定用户授予权限。我可以在 HTML 文件上使用 *ngIf 执行此操作，但我想给 HTML 元素一个 id，然后对 .ts 文件执行权限操作。

<ul class="navbar-nav float-right" *ngIf="user.name === 'John'" >
  <li class="nav-item" >
    <a class="nav-link" routerLink="Private">Private</a>
  </li>
</ul>

提前致谢。

标签： htmlangularangular-elements

解决方案

您可以在 html 文件中使用模板引用语法。并在您的组件代码中使用ViewChild 。

<ul class="navbar-nav float-right" #privateUL>
  <li class="nav-item" >
    <a class="nav-link" routerLink="Private">Private</a>
  </li>
</ul>

--

  @ViewChild("privateUL", { static: false }) ul: ElementRef;

  ngAfterViewInit() {
    // modify your element
    this.ul.nativeElement.style.backgroundColor = "blue";
  }

检查这个stackblitz示例。

推荐阅读