Hi Dev,
This tutorial is focused on *ngSwitch condition in angular example. We will use angular 9/8/7 ngSwitch directive example. you can see angular *ngSwitch example. i would like to share with you angular ngSwitch condition example. You just need to some step to done ngSwitch condition in angular 9/8/7 example.
This article will give you simple example of ngSwitch condition in angular. You can easily use ng switch in angular 6, angular 7, angular 8 and angular 9 example.
ngSwitch directive provide you to write simple switch case of javascript. you can see bellow simple example that will help you more:
src/app/app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
mySwitchVar = "one";
}
src/app/app.component.html
<h1>Angular NgSwitch Directive Example - ItSolutionstuff.com</h1>
<div [ngSwitch]="mySwitchVar">
<div *ngSwitchCase="'one'">
<p>Switch Case One</p>
</div>
<div *ngSwitchCase="'two'">
<p>Switch Case Two</p>
</div>
<div *ngSwitchCase="'three'">
<p>Switch Case Three</p>
</div>
<div *ngSwitchDefault>
<p>Switch Case Default</p>
</div>
</div>
I also posted for ng if else condition in angular. so visit on bellow link:
ngIf Else Condition in Angular
I hope it can help you...
Do you like below Tutorials ?
- Angular Json Pipe Example | Json Pipe in Angular 9/8/7
- Angular Slice Pipe Example | Slice Pipe in Angular 9/8/7
- Angular Uppercase Pipe Example | Uppercase Pipe in Angular 9/8/7
- Angular LowerCase Pipe Example | LowerCase Pipe in Angular 9/8/7
- Angular Titlecase Pipe Example | Titlecase Pipe in Angular 9/8/7
- Angular KeyValue Pipe Example | KeyValue Pipe in Angular 9/8/7
- Call Method from One Component to Another Component in Angular
- Angular Push Object into Array Example