Angular 2How to Use ngif


Introduction

*NgIf: It removes or recreates a part of DOM tree depending on an expression evaluation. It is a structural directive and structural directives alter the layout of the DOM by adding, replacing and removing its elements.

Syntax

  • <div *ngIf="false"> test </div> <!-- evaluates to false -->
  • <div *ngIf="undefined"> test </div> <!-- evaluates to false -->
  • <div *ngIf="null"> test </div> <!-- evaluates to false -->
  • <div *ngIf="0"> test </div> <!-- evaluates to false -->
  • <div *ngIf="NaN"> test </div> <!-- evaluates to false -->
  • <div *ngIf=""> test </div> <!-- evaluates to false -->
  • All other values evaluate to true.