Structural Directives
import { Component } from '@angular/core';
@Component({
selector: 'my-tutorials',
template: `<h2>{{title}}</h2>
<p *ngIf="showElement">Show Element</p>
<div [ngSwitch]="color">
<p *ngSwitchWhen="'red'">Red paragraph is shown</p>
<p *ngSwitchWhen="'blue'">Blue paragraph is shown</p>
<p *ngSwitchDefault>Invalid paragraph is shown</p>
</div>
<ul>
<li *ngFor="let color of colors">{{color}}</li>
</ul>`,
})
export class TutorialsComponent{
public title = "Tutorials from Joatmon Channel";
public showElement = true;
public color = "red";
public colors = ['red','blue','green'];
}