if-directive in Angular
In Angular kan je ervoor zorgen dat een tag
wordt getoond of verborgen afhankelijk
van de waarde van een variabele. Hiervoor wordt de
speciale directive *ngIf gebruikt. Laten we
bekijken hoe je ermee werkt.
Om te beginnen moet deze directive worden geïmporteerd:
import {NgIf} from "@angular/common";
En voeg deze toe aan de imports-sectie in de decorator:
@Component({
.....
imports: [....., NgIf],
....
})
Stel dat we nu de volgende variabele hebben:
export class AppComponent {
public isAdmin: boolean = true;
}
Laten we een div maken die wordt getoond,
als deze variabele de waarde true heeft:
<div *ngIf="isAdmin">
text
</div>
En laten we het nu zo maken dat de div wordt getoond,
als onze variabele de waarde false heeft:
<div *ngIf="!isAdmin">
text
</div>
Maak een eigenschap isAdult. Toon
tekst voor volwassenen, als in onze variabele
de waarde true ligt.
