*またはngIfディレクティブで複数の条件を使用する方法オペレータ角度4

Question

ユーザーまたは管理者がログインするときに要素を変更する必要があるnavbarがあります。認証後、いくつかの要素が変更されている必要があります。そのためにはngIfディレクティブを使用します。 これは私のnavbarテンプレートです。

<nav class="navbar navbar-expand-lg navbar-dark bg-dark"> 
    <a class="navbar-brand" href="#">MEAN</a> 
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor02" aria-controls="navbarColor02" aria-expanded="false" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    </button> 

    <div class="collapse navbar-collapse" id="navbarColor02"> 
    <ul class="navbar-nav mr-auto"> 
     <li class="nav-item active" *ngIf="!auth.loggedIn() || !admin.loggedIn()"> 
     <a class="nav-link" routerLink = "/">Home</a> 
     </li> 
     <li class="nav-item" *ngIf="!auth.loggedIn() || !admin.loggedIn()"> 
     <a class="nav-link" routerLink = "/login">Login</a> 
     </li> 
     <li class="nav-item" *ngIf="!auth.loggedIn() || !admin.loggedIn()"> 
     <a class="nav-link" routerLink = "/register" >Register</a> 
     </li> 
     <li class="nav-item" *ngIf="auth.loggedIn()"> 
     <a class="nav-link" routerLink = "/dashboard">Dashboard</a> 
     </li> 
     <li class="nav-item" *ngIf="auth.loggedIn()"> 
     <a class="nav-link" routerLink = "/edit">Edit User</a> 
     </li> 
     <li class="nav-item" *ngIf="auth.loggedIn()"> 
     <a class="nav-link" (click)="logout()">Logout</a> 
     </li> 
     <li class="nav-item" *ngIf="admin.loggedIn()"> 
     <a class="nav-link" routerLink = "/adminPage">Edit Users</a> 
     </li> 
     <li class="nav-item" *ngIf="admin.loggedIn()"> 
     <a class="nav-link" (click)="logout()">Logout</a> 
     </li> 
    </ul> 
    </div> 
</nav> 

私は、ユーザーおよび管理者pages.Theseサービスを扱うための2つのサービスは、ローカルストレージにトークンの存在をチェックする機能を持っています。 これは、ユーザサービスから機能

loggedIn(){ 
    if(localStorage.getItem("authToken")){ 
     return true; 
    }else{ 
     return false; 
    } 
    } 

と管理サービス

loggedIn(){ 
    if(localStorage.getItem("adminToken")){ 
    return true; 
    }else{ 
    return false; 
    } 
} 

からこの1だから私は、要素の一部では、ユーザや管理者のログイン時には、非表示（自宅、登録、ログイン）したことを必要

です私はngIfディレクティブで使用したり、オペレータをしてきたことが、ヘルプの言語ミスをworks.Sorryない条件と感謝の両方のための

<li class="nav-item active" *ngIf="!auth.loggedIn() || !admin.loggedIn()"> 
      <a class="nav-link" routerLink = "/">Home</a> 
      </li> 
      <li class="nav-item" *ngIf="!auth.loggedIn() || !admin.loggedIn()"> 
      <a class="nav-link" routerLink = "/login">Login</a> 
      </li> 
      <li class="nav-item" *ngIf="!auth.loggedIn() || !admin.loggedIn()"> 
      <a class="nav-link" routerLink = "/register" >Register</a> 
      </li> 

Answer 1

ユーザーは、ユーザーまたは管理者としてログインしたときli要素が隠されるのであれば、あなたが使用する必要があります。

あなたの現在のコード

で

*ngIf="!auth.loggedIn() && !admin.loggedIn()" 

または

*ngIf="!(auth.loggedIn() || admin.loggedIn())" 

---

*ngIf="!auth.loggedIn() || !admin.loggedIn()" 

要素がhidユーザーが両方の種類のアクセスで同時にログインしている場合にのみ表示されます。これはおそらく不可能です。