Angular ngIf
- Language:: Javascript
- Type:: Front End
- Context:: Using an ngIf directive with Angular
- Description – Ways to use the ngIf directive
- Snippets
Simple form with shorthand syntax:
<div *ngIf="condition">Content to render when condition is true.</div>`Simple form with expanded syntax:
<ng-template [ngIf]="condition"><div>Content to render when condition is true.</div></ng-template>
Form with an “else” block:
<div *ngIf="condition; else elseBlock">Content to render when condition is true.</div> <ng-template #elseBlock>Content to render when condition is false.</ng-template>Shorthand form with “then” and “else” blocks:
<div *ngIf="condition; then thenBlock else elseBlock"></div> <ng-template #thenBlock>Content to render when condition is true.</ng-template> <ng-template #elseBlock>Content to render when condition is false.</ng-template>- Dependencies:: – Angular - NgIf
📇Additional Metadata
- 📁Type::#type/snippet
- 🏷️Tags::
- 📡Status::#status/🌲