Angular 验证后隐藏菜单链接

我目前参与了一个使用Angular和IdentityServer4身份验证服务的项目。当前，当用户第一次访问我们的页面时，我们显示了一个登录链接。当用户单击此链接时，他们将被重定向到IdentityServer登录页面。成功登录后，用户将重定向回我们的服务，从而提供新的菜单链接

问题是存在一个延迟，即正在使用的OidcSecurityService库可以确定我们是否经过身份验证。在此延迟期间 登录链接在确认身份验证后消失之前仍然可用

我已经考虑过在默认情况下隐藏登录名，并且仅在我们未登录且OidcSecurityService未登录时显示此链接 根据我所见，没有任何方法可以让我们知道是否进行了身份验证检查

是否有一种推荐的方法使登录链接在初始页面显示时根本不可用

HTML

    <li routerLinkActive="active" class="hide"
        *ngIf="!userIsAuthorized"
        [ngClass]="{'show': showLogin, 'hide': !showLogin }">
      <a style="cursor:pointer;" (click)="onLogin()">Login</a>
    </li>

<li routerLinkActive="active" *ngIf="!userService.userIsAuthorized || !userService.loginClick"> <!-- Only show if the user isn't authorized or login hasn't been clicked -->
  <a style="cursor:pointer;" (click)="onLogin()">Login</a>
</li>

---

使用当前设置，您需要将loginClicked变量添加到用户服务中。此外，最好还是坚持使用

ngIf

或

ngClass

，而

ngIf

是更可靠的方法

HTML

    <li routerLinkActive="active" class="hide"
        *ngIf="!userIsAuthorized"
        [ngClass]="{'show': showLogin, 'hide': !showLogin }">
      <a style="cursor:pointer;" (click)="onLogin()">Login</a>
    </li>

<li routerLinkActive="active" *ngIf="!userService.userIsAuthorized || !userService.loginClick"> <!-- Only show if the user isn't authorized or login hasn't been clicked -->
  <a style="cursor:pointer;" (click)="onLogin()">Login</a>
</li>

---

我创建了一个用于显示其工作原理的程序。

使用当前设置，您需要向用户服务添加一个loginClicked变量。此外，最好还是坚持使用

ngIf

或

ngClass

，而

ngIf

是更可靠的方法

HTML

    <li routerLinkActive="active" class="hide"
        *ngIf="!userIsAuthorized"
        [ngClass]="{'show': showLogin, 'hide': !showLogin }">
      <a style="cursor:pointer;" (click)="onLogin()">Login</a>
    </li>

<li routerLinkActive="active" *ngIf="!userService.userIsAuthorized || !userService.loginClick"> <!-- Only show if the user isn't authorized or login hasn't been clicked -->
  <a style="cursor:pointer;" (click)="onLogin()">Login</a>
</li>

---

我创建了一个演示如何工作的示例代码。

为我们提供一些示例代码。有六种方法可以做到这一点，但是使用预先存在的代码，我们可能能够向您展示一种快速清理的方法。@Z.Bagley我发现的问题是，Oidbc服务只触发用户服务的加载事件，该事件会隐藏并显示它是否真的进行了身份验证。因此，当用户未登录时，我的更新将永远不会发生。因此，默认情况下我无法隐藏登录，因为我将永远无法显示它。。。。。。给我们一些示例代码。有六种方法可以做到这一点，但是使用预先存在的代码，我们可能能够向您展示一种快速清理的方法。@Z.Bagley我发现的问题是，Oidbc服务只触发用户服务的加载事件，该事件会隐藏并显示它是否真的进行了身份验证。因此，当用户未登录时，我的更新将永远不会发生。因此，默认情况下我无法隐藏登录，因为我将永远无法显示它。。。。。。一个简短的问题。单击登录时，我们将从站点导航到identityserver登录页面。当它登录时，我们会被重定向回我们的站点。当loginClick返回站点时会被记住，这种方法是否仍然有效？它不会。您需要cookies才能正常工作，或者在新页面中打开。一个快速问题。单击登录时，我们将从站点导航到identityserver登录页面。当它登录时，我们会被重定向回我们的站点。当loginClick返回站点时会被记住，这种方法是否仍然有效？它不会。您需要cookies才能正常工作，或者在新页面中打开。