CODEWITHSUNDEEP
angulartypescriptswitch-statement
Alex Caron
Alex Caron

Reputation: 350

Angular 2 - ngSwitchCase

I'm learning Switch Case with Angular 2. I'm trying to echo array, but I've have to rename some words. This is what I've before :

<tbody *ngFor="let access of menu.navAccess" class="tr-content">
      <tr class="trParent">
          <td>{{ access.access | uppercase }}</td>
          <td>{{ access.accessType }}</td>
          <td><span class="glyphicon glyphicon-trash actionsBtn" data-toggle="modal" data-target="#deleteModal" (click)="showDelete(access)"></span></td>
      </tr>
</tbody>

Now, I want to include ngSwitchCase on access.accessType : 

<tbody *ngFor="let access of menu.navAccess" class="tr-content">
       <tr class="trParent">
           <td>{{ access.access | uppercase }}</td>
           <td [ngSwitch]="access.accessType">
               <span *ngSwitchCase="BusinessUnit">Business Unit</span>
           </td>
           <td><span class="glyphicon glyphicon-trash actionsBtn" data-toggle="modal" data-target="#deleteModal" (click)="showDelete(access)"></span></td>
       </tr>
 </tbody>

So, I know my access.accessType equals BusinessUnit, but in my UI, I want to show Business Unit, but nothing is showing.

What am I doing wrong ?

Upvotes: 0

Views: 684

Answers (1)

Alex Caron
Alex Caron

Reputation: 350

OK, I've found a solution. Because *ngSwitchCase want an expression, I had to declare my SwitchCase as a string, like this :

<span *ngSwitchCase="'BusinessUnit'">Business Unit</span>

with single quotes, instead of this :

<span *ngSwitchCase="BusinessUnit">Business Unit</span>

Upvotes: 2

Related Questions