Η Διεύθυνση if στο Angular

Στο Angular, είναι δυνατό να κάνετε μια ετικέτα να εμφανίζεται ή να κρύβεται ανάλογα με την τιμή μιας μεταβλητής. Για αυτό χρησιμοποιείται η ειδική διεύθυνση *ngIf. Ας δούμε πώς να δουλέψουμε με αυτήν.

Αρχικά, αυτή η διεύθυνση πρέπει να εισαχθεί:

import {NgIf} from "@angular/common";

Και να προστεθεί στο τμήμα εισαγωγών στον διακοσμητή:

@Component({
	.....
	imports: [....., NgIf],
	....
})

Ας υποθέσουμε τώρα ότι έχουμε την ακόλουθη μεταβλητή:

export class AppComponent {
	public isAdmin: boolean = true;
}

Ας φτιάξουμε ένα div που θα εμφανίζεται, αν αυτή η μεταβλητή έχει την τιμή true:

<div *ngIf="isAdmin">
	text
</div>

Και τώρα ας κάνουμε το div να εμφανίζεται, αν η μεταβλητή μας έχει την τιμή false:

<div *ngIf="!isAdmin">
	text
</div>

Δημιουργήστε την ιδιότητα isAdult. Εμφανίστε κείμενο για ενήλικες, αν στη μεταβλητή μας βρίσκεται η τιμή true.