Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ngIf - else vs two ngIf conditions [closed]

Tags:

People also ask

Can we use two conditions in ngIf?

We can use multiple conditions in *ngIf with logical operator AND (&&) to decide the trustworthy of *ngIf expression. If all conditions are true, then element will be added to the DOM.

What is difference between * ngIf and ngIf?

ngIf is the directive. Because it's a structural directive (template-based), you need to use the * prefix to use it into templates. *ngIf corresponds to the shortcut for the following syntax (“syntactic sugar”): <template [ngIf]="condition">


Consider the following code sample:

<div *ngIf="condition; else elseBlock">
    <!-- markup here --> 
</div>
<ng-template #elseBlock>
     <div>
         <!-- additional markup here -->
     </div> 
</ng-template>

Another way I can achieve the same functionality is:

<div *ngIf="condition">
    <!-- markup here --> 
</div>
<div *ngIf="!condition">
     <!-- additional markup here -->
</div>

I want to know specific reasons for which of these two ways should be used and why?