Angular 5 ngSwitch 不工作

Question

在我的应用程序中，我尝试根据用户 Angular 色实现导航栏。如果用户是管理员，则应显示不同的菜单，而对于普通用户，则应仅显示该用户的菜单。我正在使用 ngSwitch 来限制导航栏，但无法做到这一点。请看一下。

<div [ngSwitch] = "myrole">
  <ng-template *ngSwitchCase = "'Admin'">
    <nav class="navbar navbar-expand-sm bg-primary navbar-dark">
        <ul class="navbar-nav">
          <li class="nav-item active">
            <a class="nav-link" routerLink = '/home' routerActive = 'active'>Home</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" routerLink = '/logout' routerActive = 'active' >Log Out</a>
          </li>
          <li class="nav-item" style="text-align:right">
            <span class="nav-link navbar-right">{{username}}</span>
          </li>
        </ul>
      </nav>
    </ng-template>
    <ng-template *ngSwitchCase = "'NoUser'">
      <nav class="navbar navbar-expand-sm bg-primary navbar-dark">
        <ul class="navbar-nav">
          <li class="nav-item active">
            <a class="nav-link" routerLink = '/home' routerActive = 'active'>Home</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" routerLink = '/login' routerActive = 'active' >Login</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" routerLink = '/signup' routerActive = 'active' >Sign UP</a>
          </li>
        </ul>
      </nav>
    </ng-template>

    </div>

Answer 1

您的语法错误，请更改

来自

 <ng-template *ngSwitchCase = "'Admin'">

至

 <ng-template [ngSwitchCase] = "'Admin'">