Home > Software design >  How can you make the *ngIf more compact?
How can you make the *ngIf more compact?

Time:10-05

Is it possible to somehow put the condition for changing the icon in one line?

Example #1

<ng-template [ngIf]="isMenuCollapsed" [ngIfThen]="open" [ngIfElse]="close">
</ng-template>

<ng-template #open>
    <fa-icon [icon]='["fas", "bars"]'></fa-icon>
</ng-template>

<ng-template #close>
    <fa-icon [icon]='["fas", "times"]'></fa-icon>
</ng-template>

Example #2

<fa-icon [icon]='["fas", "bars"]' *ngIf="isMenuCollapsed"></fa-icon>

<fa-icon [icon]='["fas", "times"]' *ngIf="!isMenuCollapsed"></fa-icon>

CodePudding user response:

Yes, with method for example:

<fa-icon [icon]='getIcon()'></fa-icon>

In TS something like:

getIcon = () => isMenuCollapsed ? ["fas", "bars"] : ["fas", "times"];
  • Related