Angular 4 and 5:
Using else
:
<div *ngIf="isValid;else other_content">
content here ...
</div>
<ng-template #other_content>other content here...</ng-template>
You can also use then else
:
<div *ngIf="isValid;then content else other_content">here is ignored</div>
<ng-template #content>content here...</ng-template>
<ng-template #other_content>other content here...</ng-template>
Or then
alone:
<div *ngIf="isValid;then content"></div>
<ng-template #content>content here...</ng-template>
Demo:
Details:
<ng-template>
: is Angular’s own implementation of the <template>
tag which is according to MDN:
The HTML
<template>
element is a mechanism for holding client-side
content that is not to be rendered when a page is loaded but may
subsequently be instantiated during runtime using JavaScript.