Angular 2 How to Use ngif

Help us to keep this website almost Ad Free! It takes only 10 seconds of your time:
> Step 1: Go view our video on YouTube: EF Core Bulk Extensions
> Step 2: And Like the video. BONUS: You can also share it!

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.


Got any Angular 2 Question?