The if directive in Angular
In Angular, you can make a tag show or hide depending on the value of a variable. For this, a special directive *ngIf is used. Let's see how to work with it.
First, this directive needs to be imported:
import {NgIf} from "@angular/common";
And add it to the imports section in the decorator:
@Component({
.....
imports: [....., NgIf],
....
})
Now let us have the following variable:
export class AppComponent {
public isAdmin: boolean = true;
}
Let's make a div that will be shown if this variable has a value of true:
<div *ngIf="isAdmin">
text
</div>
Now let's make it so that the div is shown if our variable has the value false:
<div *ngIf="!isAdmin">
text
</div>
Make the property isAdult. Show the adult text if our variable contains the value true.