ng-container
~30 mins
Prerequisite:
loggedInUser = { id :1, name:"Naresh", role:"ADMIN"}
Task 1: Display a link if the loggedInUser is "ADMIN"
<a *ngIf="loggedInUser=='ADMIN'">Welcome {{loggedInUser.name}} </a>
Task 2: Display the loggedInUser role
<p>
Welcome {{loggedInUser.name}}
<ng-container *ngIf="loggedInUser">
( {{loggedInUser.role}} )
</ng-container>
</p>
Task 3: Display Roles
roles = ["USER","ADMIN", "TRAINER","MANAGER"];
<p> Roles -
<ng-container *ngFor="let role of roles; let first=first; let last=last">
<ng-container *ngIf="!first">,</ng-container>
<ng-container *ngIf="last">and</ng-container>
{{role}}
</ng-container>.
</p>