angular - How to use then else condition

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  isError:boolean = true;
}

app.component.html

<h2>Angular Then Else Condition</h2>

<div *ngIf="isError then errorTemplate;else lorem_ipsum">
    This line will be ignore.
</div>

<ng-template #errorTemplate>
    This document has an error.
</ng-template>

<ng-template #lorem_ipsum>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Donec tincidunt est quam, nec hendrerit nisl laoreet laoreet.
</ng-template>

More Angular tutorials

• angular - Interpolation JavaScript method
• angular - Interpolation call method
• angular - Property binding example
• angular - How to use if else condition
• angular - Multiple condition
• angular - How to use switch case default
• angular - How to use for loop
• angular - How to bind style
• angular - How to bind multiple style
• angular - Generate random number in range
• angular - Generate random whole number
• angular - How to submit form data
• angular bootstrap - How to use Popover
• angular bootstrap - Open Popover on mouse hover
• angular bootstrap - Open close Popover on button click