Direktiva if në Angular

Në Angular mund të bëhet që një tag të shfaqet ose fshihet në varësi të vlerës së një variable. Për këtë përdoret një direktivë e veçantë *ngIf. Le të shohim se si të punohet me të.

Fillimisht kjo direktivë duhet të importohet:

app/app.component.tsimport {NgIf} from "@angular/common";

Dhe të shtohet në seksionin e importeve në dekorator:

app/app.component.ts@Component({
  .....
  imports: [....., NgIf],
  ....
})

Le të themi se tani kemi variablin e mëposhtëm:

app/app.component.tsexport class AppComponent {
  public isAdmin: boolean = true;
}

Le të krijojmë një div që do të shfaqet, nëse kjo variabël ka vlerën true:

app/app.component.html<div *ngIf="isAdmin">
  text
</div>

Dhe tani le ta bëjmë që div të shfaqet, nëse variabla jonë ka vlerën false:

app/app.component.html<div *ngIf="!isAdmin">
  text
</div>