Parfois
- on peut souhaiter qu'un composant ou un élement de l'arbre DOM n'apparaisse que lorsqu'un pré-requis est rempli. La directive *ngIf permet de conditionner l'apparition d'un élement :
component.ts
import { Component } from '@angular/core';
@Component({
selector: 'selector'
-
templateUrl: './component.html'
-
styleUrls: ['./component.css']
})
export class MyComponent {
isAdmissible: boolean = true;
grade: number = 15;
}
component.html
<div>
<div *ngIf='isAdmissible'>
Congratulations on your admissibility !
</div>
<div *ngIf='grade > 10'>
Your grade granted you an admissibility !
</div>
</div>