Angular-এ if ডাইরেক্টিভ

Angular-এ একটি ট্যাগ তৈরি করা সম্ভত যেটি একটি ভেরিয়েবলের মানের উপর নির্ভর করে প্রদর্শিত বা লুকানো থাকবে। এটি করার জন্য বিশেষ ডাইরেক্টিভ *ngIf ব্যবহৃত হয়। আসুন দেখি কিভাবে এটি নিয়ে কাজ করতে হয়।

শুরুতে এই ডাইরেক্টিভটি ইম্পোর্ট করতে হবে:

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

এবং ডেকোরেটরে ইম্পোর্টস বিভাগে এটি যোগ করুন:

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

ধরুন এখন আমাদের নিম্নলিখিত ভেরিয়েবল আছে:

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

আসুন একটি div তৈরি করি, যা প্রদর্শিত হবে, যদি এই ভেরিয়েবলের মান true হয়:

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

এবং এখন এমন করি যে divটি প্রদর্শিত হবে, যদি আমাদের ভেরিয়েবলের মান false হয়:

app/app.component.html<div *ngIf="!isAdmin">
  text
</div>
Задание 1

একটি isAdult প্রোপার্টি তৈরি করুন। বড়দের জন্য টেক্সট দেখান, যদি আমাদের ভেরিয়েবলে true মান থাকে।