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 արժեքն է։